美文网首页
项目中针对babel的使用

项目中针对babel的使用

作者: 浅浅_2d5a | 来源:发表于2021-03-04 09:24 被阅读0次

为什么要使用babel
1、浏览器对es6特性支持不一
2、es6的模块化不能对npm安装的模块进行导入
babel是javascript的编辑器,将es6语法转化成es5,之后对编译的代码进行打包,页面再进行引入


image.png

安装工具:
1、babel-cli (babel命令行的一个工具)
2、babel-preset-env (内置包,能把ECMAScript进行转换为es5)
3、browserify (打包工具,比webpack简单)
步骤:
初始化项目npm i
安装依赖 npm i babel-cli babel-preset-env browserify -D (开发依赖)
局部安装babel,使用babel命令,前面加npx
转化成es5
npx babel src/js -d dist/js --presets=babel-preset-env
会生成对应的文件夹
这时候dist文件夹下的js有exports还是不能被浏览器识别,需要打包
npx browserify dist/js/m1.js -o dist/bundle.js
如果更改的原js文件,需要再次执行es6 ->es5 和打包的命令

================需求联系================
用jquery包让body背景变色
引入jquery包

相关文章

网友评论

      本文标题:项目中针对babel的使用

      本文链接:https://www.haomeiwen.com/subject/bvbciktx.html