让 express 通过 webpack 支持 es6/es7

发布时间:2019-08-09 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了让 express 通过 webpack 支持 es6/es7脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

在 webpack 的热替换, 让 es6/es7 开发速度真正达到编码如飞.

项目地址: https://github.com/TheOne1006...

启发

在 react 开发中, 需要 gIThub 中许多模板都是 webpack 支持的热替换.
https://github.com/kriasoft/r... 项目中, 我看到了让 exPress 也能够像 开发前端一样, 也能够使用 es6 语法,并且快速的转译 es6.

github 中也有 https://github.com/babel/exam... ,
也可以让 babel 转换成 es5.
但是也在开发环境下, 无法快速的编译,因为 babel 会把所有文件转换一遍.而且生产环境下依然需要 babel-cli

简单开始

NOTE: 安装环境需要 Yarn 和 Node.js v6.5 以上.
PS: 其他环境没有试过.

1.获取项目

$ git clone https://github.COM/TheOne1006/es6-exPRess.git MyApp
$ cd MyApp

2.Run yarn install

这条命令将会安装所有 package.JSON 中的项目依赖和开发工具列表.

3.Run yarn start

这条命令将 通过 (/src) 里的所有文件构建 应用 到 (/build) 目录.
一旦初始构建完成, 它将启动 Node.js 服务(node build/server.js).

完成构建后将会启动三个端口,默认为

  1. localhost:3000 -- Node.js 服务 (build/server.js)

  2. localhost:3001 -- browserSync 代理

  3. localhost:3002 -- BrowserSync 管理界面

完成后会自动打开,浏览器并访问 localhost:3001

这时可以修改 src/* 中的代码, 在控制台即可看见更新的进程.
相对于使用 nodemon babel-node 检测更新快了许多.
同时在代码中也可以使用 async 等 es6/es7 的语法.

脚本宝典总结

以上是脚本宝典为你收集整理的让 express 通过 webpack 支持 es6/es7全部内容,希望文章能够帮你解决让 express 通过 webpack 支持 es6/es7所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。