首页 > 编程知识 正文

es6转es5用哪个插件,es6转es5 poli

时间:2023-05-06 06:28:34 阅读:274257 作者:525

一、为什么要把ES6转为ES5

首先我们知道webpack打包好的文件是放到 /dist/bundle.js里面的,如果仔细阅读bundle.js,会发现当中的大部分语法都是ES6,这样就产生了一个问题,许多不支持ES6语法的浏览器是无法解析我们打包好的bundle.js。因此我们需要做的是,在打包文件的时候,如果有ES6的语法,统一打包成ES5, 这样就能确保在最终输出的bundle.js中的语法是ES5的,从而让大部分的浏览器都能正常运行。

二、找到babel-loader

1.首先是安装: npm install babel-loader@7 --save-dev babel-core babel-preset-es2015。一共是安装三个东西,这里和官网给出的有点不同。babel-loader@7: 表示安装版本为7的babel-loader;balel-core: 表示安装babel-core的核心包;babel-preset-es2015表示安装babel的配置包,且是以es2015作为配置文件(这个我不太懂)。 2. 然后是配置webpack.config.js: 上面的配置重点在两个地方,一个是exclude:/(node_modules| bower_components)/ ,它的意思就是说node_modules或者bower_components文件夹中的js文件如果有ES6的语法,不要给我转为ES5。还有一个是presets: ['es2015'], 它的意思就是babel-loader的配置是根据es2015来,具体这个作用我不是很懂。

三、总结

当做完上面两步之后,重新进行打包,就可以发现新生成的bundle.js中没有了ES6的语法了,都是ES5的

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。