首页 > 解决方案 > Babel/Webpack 转译 JS 错误“对象不支持属性或方法‘最近的’”

问题描述

我假设的错误是在 IE11 达到以下语法时生成的

不知道为什么它不转译这个?我想知道它是否是我使用的 polyfil 版本?

polyfil 在以后的版本中是否完全支持 elem.closest 方法,或者有没有我可以使用的替代方法而不是最接近的方法?

包.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%

标签: javascriptwebpackbabeljstranspiler

解决方案


推荐阅读