为什么一定要配置babel?
Node项目对es6的完美支持,因此在项目中要使用es6语法。但目前有些浏览器不支持es6语法,babel可以帮助我们将es6语法转换成es5语法运行。Node支持commonjs的es5的语法规范,不支持es6,我们使用babel转换一下就可以了
如果不在项目中配置babel,运行app.js文件会报以下错误

报错信息

在node.js项目中不使用babel,是不能使用es6等高阶语法
借助第三方类库babel,将高阶语法转换成能够运行的低阶语法的
- 配置转换环境,在education项目中新建.babelrc文件

- 在.babelrc文件中手动配置一个如下对象(默认配置)

Babel把所有的配置都集成到env里面了,所以把babel预设置为env,,所有的转化都会遵循这个里面配置的规则。 - 安装babel ,因为发布到线上时,不需要使用babel,所有安装成开发依赖就行了,安装命令如下:npm install babel-preset-env - -save-dev(开发环境中需要,生产环境中不需要)

- 出现版本号,表示安装成功

- 生产依赖 和 开发依赖

- 安装babel-register,可以理解为一个小插件,将es6的东西转换成es5.安装命令:npm install babel-register - -save-dev

- 显示版本号,说明安装成功

- 此时package.json中的显示已安装的的插件

- 配置成功,可以使用es6等高阶语法了!
- 在education项目中新建src文件夹,将app.js文件放置src文件中。对外不再使用app.js进行暴露。根目录下新建main.js文件。现在项目目录如下

- 编写main.js文件,在main.js文件中引入babel-register文件,引入src文件下的app.js文件。运行的时候就运行main.js.此时main.js通过引入的babel-register插件转换src下的app.js文件中的语法

- 改变package.json文件,运行main.js文件,而不是app.js.
修改前:

修改后:

- 现在可以通过两种方式运行项目 一:node main.js 二 npm run dev


- 运行es6语法不再报错,说明babel可以正常使用啦

后面在项目中可以放心使用的es6等高阶语法了
本文解析了为何在Node项目中需配置Babel,因部分浏览器不支持ES6语法,Babel能将其转换为ES5以确保兼容性。介绍了如何在项目中配置Babel,包括安装和设置.babelrc文件,以及使用babel-register运行ES6语法。
230

被折叠的 条评论
为什么被折叠?



