Я добавил много настроек, предоставленных Babel или другими из переполнения стека, но новые функции ES6, такие как функция стрелки и параметр по умолчанию, все еще находятся в моем bundle.js
В bundle.js есть содержимое, подобное приведенному ниже:
var nn = function(e={}) {
const {baseClasses: t, newClasses: n, Component: r} = e;
if (!n)
return t;
const a = At()({}, t);
return Object.keys(n).forEach(e=>{
n[e] && (a[e] = `${t[e]} ${n[e]}`)
}
),
a
};
В результате, когда я открываю свою страницу в IE11, произошла ошибка missing ')', указывающая на function(e={}).
Вот мой webpack.config.js:
const entries = require("./config/pages").reduce(function(map, page) {
map[page] = `./src/${page}/index.js`;
return map;
}, {});
module.exports = {
mode: 'development',
entry: ["@babel/polyfill",...entries],
output: {
path: path.resolve(__dirname,'dist'),
publicPath: '/',
filename: 'myapp/static/js/[name]/bundle.js'
},
devtool: 'source-map',
module: require("./config/loaders"),
devServer:{
open: true,
publicPath: '/',
historyApiFallback: true,
disableHostCheck: true
},
plugins: [
new MiniCssExtractPlugin({
filename: "[name].css",
chunkFilename: "[id].css"
}),
new webpack.ProvidePlugin({
fetch: "isomorphic-fetch",
})
]
};
и ./config/loaders для модуля
module.exports = {
rules: [
{
test: /\.(js|jsx)$/,
// exclude: /node_modules/,
loader: 'babel-loader',
},
{
test: /\.(css|less)$/,
use: ["style-loader", "css-loader", "less-loader"]
},
{
test: /\.(png|jpg|gif)$/,
use: [
{
loader: 'url-loader',
options: {
limit: 500, //small than 500 use url, otherwise use base64
outputPath:'inquiry/static/img/'
}
}
]
},
{
test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
use: [{
loader: 'file-loader',
options: {
outputPath: 'myapp/static/fonts/'
}
}]
}
]
};
.babelrc:
{
"presets": [
// ["@babel/env",
// {
// "targets": {
// "browsers": "ie 11"
// },
// "useBuiltIns": "usage",
// "corejs": "3.0.1",
// }
// ],
["@babel/preset-env",
{
"useBuiltIns": "entry",
"corejs": "3.0.1",
}],
"@babel/react"
],
"plugins": [
["@babel/transform-runtime"],
["@babel/plugin-transform-parameters"],
["@babel/plugin-transform-arrow-functions"],
[
"@babel/plugin-proposal-decorators",
{
"legacy": true
}
],
[
"@babel/plugin-proposal-class-properties",
{
"loose": true
}
],
]
}
Кроме того, я импортировал '@ babel / polyfill' в свой index.js
PS: Я заметил, что код содержит функции ES6 из библиотеки Meterial UI в node_modules, поэтому я удалил exclude: /node_modules/, в правиле загрузчика babel, но он по-прежнему не работает.
