I have a problem with webpack and IE11. I use Babel for transpiling and all functions and stuff are transpiled exept the webpackbootstrap functions. As seen in the image you can see an arrow function that's breaking IE11. I also created my own function and JS and that IS transpiled so only webpack's own js is not transpiled. Does anyone have seen the same problem? I have been searching the internet for 2 days now and tried many solutions but none of them fixed the issue.
As you can see in the images babel is transpiling correctly everything except for the default webpack javascripts.
I'm loosing my mind on this, please help me!
Thanks in advance.
webpack.config.js
const HtmlWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const path = require("path");
module.exports = {
module: {
rules: [
{
test: /\.scss$/,
use: [
MiniCssExtractPlugin.loader,
{
loader: 'css-loader'
},
{
loader: 'sass-loader',
options: {
sourceMap: true,
// options...
}
}
]
},
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env'],
plugins: ["@babel/plugin-transform-arrow-functions"]
}
}
}
]
},
plugins: [
new HtmlWebpackPlugin({
template: path.resolve(__dirname, "src", "index.html")
}),
new MiniCssExtractPlugin({
filename: 'css/main.css'
})
]
};package.json
{
"name": "webpack-tutorial",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "webpack --mode development",
"start": "webpack serve --mode development",
"build": "webpack --mode production",
"start-prod": "webpack serve --mode production",
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"@babel/core": "^7.12.0",
"@babel/plugin-proposal-class-properties": "^7.10.4",
"@babel/plugin-transform-arrow-functions": "^7.10.4",
"@babel/preset-env": "^7.12.0",
"babel-loader": "^8.1.0",
"babel-preset-es2015": "^6.24.1",
"css-loader": "^5.0.0",
"html-webpack-plugin": "^4.5.0",
"mini-css-extract-plugin": "^1.0.0",
"sass": "^1.27.0",
"sass-loader": "^10.0.3",
"style-loader": "^2.0.0",
"webpack": "^5.1.0",
"webpack-cli": "^4.0.0",
"webpack-dev-server": "^3.11.0"
}
}
Example JS input
Example JS output
