The error I assume is being generated when IE11 hits the followig syntax
Not sure why its not transpiling this? I am wondering if its the version of polyfil I am using?
Does polyfil support the elem.closest method at all in later versions or is there an alternative method I can use instead of closest?
package.json
{
"name": "validation",
"version": "1.0.0",
"description": "Cart Validation",
"main": "index.js",
"watch": {
"build": "./src/"
},
"scripts": {
"dev": "webpack --mode development",
"build": "webpack --mode production",
"watch": "npm-watch"
},
"author": "",
"license": "ISC",
"devDependencies": {
"@babel/core": "^7.12.10",
"@babel/preset-env": "^7.12.11",
"babel-loader": "^8.2.2",
"webpack": "^5.18.0",
"webpack-cli": "^4.4.0"
},
"dependencies": {
"@babel/polyfill": "^7.12.1",
"@babel/runtime": "^7.12.5",
"core-js": "^3.8.3",
"i18n": "^0.13.2",
"i18next": "^19.9.1",
"npm-watch": "^0.7.0"
}
}
webpack.config.js
const path = require('path');
module.exports = {
devtool: "eval-source-map",
entry: ["@babel/polyfill", "./src/index.js"], //location of your main js file
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js'
},
module: {
rules: [
{
test: /\.js$/, //using regex to tell babel exactly what files to transcompile
exclude: /node_modules/, // files to be ignored
use: {
loader: 'babel-loader' // specify the loader
}
}
]
}
}
.babelrc
{
"presets": [
["@babel/preset-env",
{
//only include polyfills and code transforms needed for users whose browsers have >0.25% market share (ignoring browsers without security updates like IE 10 and BlackBerry):
"useBuiltIns": "entry"
}]
]
}
.browserslist
ie >= 11
> 0.25%