關(guān)于vuejs-templates/webpack 中 “exports is not define

nicercode 發(fā)布于2019-08-20 16:46 / 3458人閱讀

摘要：利用腳手架搭建的項(xiàng)目，使用的是的模板。但在引用第三方組件的時候，在瀏覽器中報錯。根據(jù)瀏覽器報錯信息，查詢到報錯來源是第三方組件的一段代碼這是使用了寫法，而在應(yīng)用中并沒有做相應(yīng)的模塊轉(zhuǎn)換使得瀏覽器能夠識別。

利用vue-cli腳手架搭建的項(xiàng)目，使用的是vuejs-templates/webpack的模板。
但在引用第三方組件的時候，在瀏覽器中報錯“exports is not defined”。
根據(jù)瀏覽器報錯信息，查詢到報錯來源是第三方組件的一段代碼：

Object.defineProperty(exports, "__esModule", {
  value: true
});

這是使用了CommonJs寫法，而在應(yīng)用中并沒有做相應(yīng)的模塊轉(zhuǎn)換使得瀏覽器能夠識別。而導(dǎo)致這個問題是因?yàn)閎albel的配置文件.babelrc的問題：

{
  "presets": [
    ["env", { "modules": false }],
    "stage-2"
  ],
  "plugins": ["transform-runtime"],
  "comments": false,
  "env": {
    "test": {
      "presets": ["env", "stage-2"],
      "plugins": [ "istanbul" ]
    }
  }
}

其中{ "modules": false }阻止了babel進(jìn)行模塊轉(zhuǎn)換，具體見modules配置的說明，所以，將modules改為默認(rèn)設(shè)置即可，或者刪除該配置。

初學(xué)Vue中，記錄學(xué)習(xí)中遇見的問題以作備查，如果有不對的地方，還望指正。

云服務(wù)器 GPU云服務(wù)器關(guān)于JAVA中順序IO的基本操作關(guān)于平臺關(guān)于加班關(guān)于學(xué)習(xí)

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/83143.html

相關(guān)文章

自定義自己的vue-cli模板

摘要：自定義自己的模板在使用的過程中，常用的模板只為我們提供最基礎(chǔ)的內(nèi)容，但每次需要新建一個項(xiàng)目的時候就需要把之前項(xiàng)目的一些配置都搬過來，這樣就造成挺大的不方便，如果是作為一個團(tuán)隊(duì)，那么維護(hù)一個通用的模板，我認(rèn)為是挺有必要的。自定義自己的vue-cli模板在使用vue-cli的過程中，常用的webpack模板只為我們提供最基礎(chǔ)的內(nèi)容，但每次需要新建一個項(xiàng)目的時候就需要把之前項(xiàng)目的一些配置...

付永剛 2019-08-21 17:42 評論0 收藏0
自定義自己的vue-cli模板

摘要：自定義自己的模板在使用的過程中，常用的模板只為我們提供最基礎(chǔ)的內(nèi)容，但每次需要新建一個項(xiàng)目的時候就需要把之前項(xiàng)目的一些配置都搬過來，這樣就造成挺大的不方便，如果是作為一個團(tuán)隊(duì)，那么維護(hù)一個通用的模板，我認(rèn)為是挺有必要的。自定義自己的vue-cli模板在使用vue-cli的過程中，常用的webpack模板只為我們提供最基礎(chǔ)的內(nèi)容，但每次需要新建一個項(xiàng)目的時候就需要把之前項(xiàng)目的一些配置...

Sleepy 2019-08-01 18:01 評論0 收藏0
Vue-Donut——專用于構(gòu)建Vue的UI組件庫的開發(fā)框架

摘要：相信不少使用的開發(fā)者和公司都有定制一套屬于自己的組件庫的需求。針對這個問題，我搭建了一個專門用來構(gòu)建的組件庫的開發(fā)框架，以節(jié)省搭建環(huán)境的勞動力，專心于組件庫的開發(fā)。首先我們嘗試了使用的方案，就是把組件庫直接作為項(xiàng)目的子模塊使用。 showImg(https://segmentfault.com/img/bVNais?w=1226&h=1159); 相信不少使用Vue的開發(fā)者和公司都有定...

stormgens 2019-08-20 16:19 評論0 收藏0
vue-cli 使用 webpack-bundle-analyzer

摘要：才來公司，填坑。然后發(fā)現(xiàn)項(xiàng)目打包越來越大。然后就滿世界找解決方法。網(wǎng)上看到這個神器。然后我配置完畢各種報錯。然后去看的官方文檔。然后找到然后再看文檔?？催@段不用配置任何，在的時候添加參數(shù)就好啦。然后運(yùn)行一下，瀏覽器訪問。浪費(fèi)幾多時間。才來公司，填坑。然后發(fā)現(xiàn)項(xiàng)目打包越來越大。然后就滿世界找解決方法。網(wǎng)上看到 webpack-bundle-analyzer 這個神器。然后各種說配置 ...

bingchen 2019-08-21 18:29 評論0 收藏0
搭建一個多頁面的無依賴的工程化項(xiàng)目

摘要：也就是說，我們需要做一個非單頁應(yīng)用的工程化項(xiàng)目?，F(xiàn)在這個項(xiàng)目的靜態(tài)資源是以文件哈希值來控制的。這個該怎么解決呢感謝，我們可以通過如下的配置來實(shí)現(xiàn)意思就是如果圖片是在中引用的則不加哈希值，在文件中引入的則加上。最近金拱門比較火，我們先戳開它的官網(wǎng)看看。看完后，如果你老板要是讓你做這么一個網(wǎng)站，一定要seo，一定要兼容IE，你會怎么去做呢？用vue/react吧，單頁應(yīng)用滿足不了se...

go4it 2019-08-21 17:18 評論0 收藏0