为什么要使用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包
网友评论