const arr = [ new Promise(()=>{}), new Promise(()=>{}) ]; arr.map(item => { console.log(item); })
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>html template</title> </head> <body> <div id=‘root‘></div> </body> </html>
运行npx webpack(用dev-server打包放在了缓存里面，看不到最终的打包内容)。看到打包生成的main.js的最后几行，index里面写的js，原封不动的打包到了main.js里面。这个时候浏览器中运行，可以打印出promise对象。好像是没问题的，这是什么原因呢，这是因为chrome更新比较快，es6里面很多东西，他都做了实现，所以直接在chrome浏览器写es6语法没问题，但是比如在ie或者更新没那么快的浏览器，，，就会报错。。。
npm install --save-dev babel-loader @babel/core
webpack配置babel相关
module.exports = { module: { rules:[{ test: /\.js$/, exclude: /node_modules/, loader: "babel-loader" }] } }
npm install @babel/preset-env --save-dev
module.exports = { module: { rules:[{ test: /\.js$/, exclude: /node_modules/, loader: "babel-loader", options:{ "presets": ["@babel/preset-env"] } }] } }
import "@babel/polyfill"; const arr = [ new Promise(()=>{}), new Promise(()=>{}) ]; arr.map(item => { console.log(item); });
安装
npm install core-js --save-dev
module.exports = {
module: { rules:[{ test: /\.js$/, exclude: /node_modules/, loader: "babel-loader", options:{ presets: [[‘@babel/preset-env‘,{ /** * 当我做polyfill填充的时候，去加一些低版本特性的时候，我不是把所有特性都加进来 * 是根据你的业务代码来决定要加什么 */ useBuiltIns: ‘usage‘, corejs: 3 }]] } }] } }
原文：https://www.cnblogs.com/wzndkj/p/10772173.html