ivew-admin 解決IE10+瀏覽器不相容

蘇小溪發表於2019-03-26
IE10瀏覽器

iview-admin

版本： "2.0.0"

  1. 在本地安裝 babel-polyfill
yarn add babel-polyfill --save 
複製程式碼

2.在main.js中

import '@babel/polyfill'
複製程式碼

3.在本地新建babel.config.js檔案，檔案和vue.config.js同級目錄,拷貝下面程式碼

module.exports = {
  presets: [
![](https://user-gold-cdn.xitu.io/2019/3/26/169b98b2921c3e31?w=1310&h=647&f=png&s=69875)
    ['@vue/app', {
      useBuiltIns: 'entry' // src全域性es5編譯
    }]
  ]
}
複製程式碼

4.修改vue.config.js

 require('babel-polyfill')
  module.exports = {
    ...{ /* 一些別的配置 */ },
    
    // 關鍵配置：node_modules裡面需要用babel-loader進行編譯的包（node_modules的包如果沒做 es6 => es5 轉碼則需要自己用babel-polyfill進行手動處理）
    // 如果IE下還跑不起來，控制檯發現有其他es6語法的，嘗試除錯去找到底是哪個包
    transpileDependencies: [
     'iview',
    'axios',
    'tree-table-vue',
    'v-org-tree'
    ],
  }

複製程式碼

重新執行 npm run dev 或者 npm run serve 即可

注意 有時候可能還會報語法錯誤，具體可以定位看下，會指明到具體的外掛，這個時候需要在vue.config.js中transpileDependencies加入外掛名，如上面的tree-table-vue和v-org-tree

感謝群友@衝鴨提供的解決方法，在此記錄下，希望遇到的朋友們可以參考！

相關文章