Webpack-AngularJS應用程序無法在IE11上運行

Question

AngularJS應用程序正在使用webpack，創建了一些模塊，這些模塊也可以與webpack一起使用。 在所有瀏覽器中運行該應用程序時，除IE11以外，其他所有功能均正常運行。 這是IE11控制台中顯示的當前錯誤。

SCRIPT1006: Expected ')'
File: vendor.bundle.js, Line 1, Column 546833

錯誤發生在已“ webpackified”的一個導入模塊上，嘗試刪除該模塊和我們的另一個組件，該組件位於不同的回購錯誤中。 認為這可能是webpack錯誤，並且babel將解決此問題。

.bablerc

{
"presets": [
    [ "env", {
     "targets": {
      "browsers": ["last 2 versions", "ie >= 11"]
    },
          "useBuiltIns": true
      }]
    ]
}

的package.json

"devDependencies":{
  "babel-core": "^6.26.3",
  "babel-loader": "^7.1.4",
  "babel-polyfill": "^6.26.0",
  "babel-preset-env": "^1.7.0",
  "eslint": "^5.0.1",
  "eslint-loader": "^2.0.0",
  "file-loader": "^1.1.11",
  "happypack": "^5.0.0",
  "hard-source-webpack-plugin": "^0.9.0",
  "html-loader": "^0.5.5",
  "html-webpack-plugin": "^3.2.0",
  "json-loader": "^0.5.7"
},
"dependencies":{
  ...,
  "dataservice": "git+ssh://git@<remote-server>/dataService.get#webpackify",
  "cart": "git+ssh://git@<remote-server>/cart.git#webpackify"
},
"externals": [
  "dataservice/app",
  "cart/app"
]

使用angularJS版本“ ^ 1.7.2”和webpack版本“ ^ 4.12.1”

內部的webpack.config.js具有在angularJS應用中構建外部模塊以及當前javascript文件的功能。

webpack.config.js

module.exports = {
  entry: ["babel-polyfill", "./scripts/app.js"],
  modules.rules: [
    {  
      enforce: 'pre',
      test: /\.js$/,
      include: build_externals(),
      loader: 'eslint-loader'
    },
    {
      test: /\.js$/,
      include: build_externals(),
      use: 'happypack/loader?id=ECMAScript'
    }
  ],
  plugins: [
    {
     loader: 'babel-loader',
     options: {
      presets: ['env'],
      plugins: ['transform-es2015-modules-commonjs']
     }
   },
   new HappyPack({
    id: 'ECMAScript',
    threads: 4,
    loaders: happy_js_loader
   })
  ]
}

我一直在這個問題上失去理智。 希望那里的人能夠為您提供幫助。 提前致謝。

Answer 1

因此，解決我的問題的方法是為外部模塊提供正確的路徑。 Webpack將這些包括在構建過程中。 IE瀏覽器完美運行。

的package.json

"externals": [
 "node_modules/dataservice/app",
 "node_modules/cart/app"
]