1. 程式人生 > >使用 Vue CLI3 時遇到的問題

使用 Vue CLI3 時遇到的問題

Vue CLI3 爬坑指南,使用 elementUI 在 IE 下的相容性問題,重複宣告 h 問題,ES5 commonjs 模組問題等。持續更新中。

Troubleshooting

  • exports is not defined
Uncaught ReferenceError: exports is not defined

如果該依賴交付 ES5 程式碼,但使用了 ES6+ 特性且沒有顯式地列出需要的 polyfill (例如 Vuetify):請使用 useBuiltIns: 'entry' 然後在入口檔案新增 import '@babel/polyfill'。這會根據 browserslist 目標匯入所有 polyfill,這樣你就不用再擔心依賴的 polyfill 問題了,但是因為包含了一些沒有用到的 polyfill 所以最終的包大小可能會增加。

more info

see vue-loader

  • Duplicate declaration "h" (This is an error on an internal node. Probably an internal error.)

@vue/cli V3,不用配置可以直接用,否則配置後會報重複宣告錯誤
但是 @vue/cli V2+,需要在 babel.config.js 顯式配置:

module.exports = {
  plugins: ["transform-vue-jsx"]
}

see babel-plugin-transform-vue-jsx

  • element-ui 造成的 IE Compatability

如果 element-ui 版本是 2.4.9 可以直接使用。
2.4.9 未知。
如果 element-ui 版本是 2.4.11 在 IE瀏覽器中報錯,需要在 vue.config.js 中加入,感覺原因是因為 eleFE 沒有測試過 IE11 就發版了,這個問題找了我幾個小時。解決辦法是:

module.exports = {
  transpileDependencies: ['element-ui']
}

see why need this

see transpileDependencies