express下使用ES6

1

2

3

4

5

6

7

8

9

//环境切换配置 package.json

scripts:{

"service""NODE_ENV=production PORT=3000 npm start"

}

//node js判断

var app = express();

app.get('env') === 'production'

  

原文地址:https://segmentfault.com/a/1190000006707756?utm_source=tuicool&utm_medium=referral

要让Express在ES6下跑起来就不得不用转码器Babel了。首先新建一个在某目录下新建一个项目。然后跳转到这个目录下开始下面的操作。

简单走起

安装babel-cli

$ npm install --save-dev babel-cli

然后,可以安装一些presets

$ npm install --save-dev babel-preset-es2015 babel-preset-stage-2

现在就应该安装express

$ npm install --save express

再创建一个我们要运行的index.js

$ touch index.js

添加如下代码

import Express from 'express';let app = Express();app.get('/', (req, res) => {res.send(`hello world!`);
});app.listen(4321, () => {console.log('server running http://localhost:4321');
});

package.json里添加运行的脚本

"scripts": {
+   "start": "babel-node index.js --presets es2015,stage-2"
}

现在开始运行我们的server。

$ npm start

你现在就可以在http://127.0.0.1:4321下看到hello world了。

使用nodemon监视文件修改

我们可以修改npm start,添加对nodemon的引用。

$ npm install --save-dev nodemon

修改脚本。

"scripts": {
- "start": "babel-node index.js"
+ "start": "nodemon index.js --exec babel-node --presets es2015,stage-2"
}

运行server

$ npm start

你现在就可以修改index.js,而且因为有了nodemon我们的server会在修改发生后自动重启。

在server还在运行的时候,修改index.js,把hello world改成YO YO YO!。然后刷新页面,你就会看到页面内容已经是YO YO YO!了。

准备生产环境

使用babel-node只是可以让server运行起来,但是还不能上产品环境。

我们需要预编译我们的代码,那么现在就来开始准备上生产。

首先把index.js文件移到lib/index.js

$ mv index.js lib/index.js

接下来修改npm start脚本。

"scripts": {
- "start": "nodemon index.js --exec babel-node --presets es2015,stage-2"
+ "start": "nodemon lib/index.js --exec babel-node --presets es2015,stage-2"
}

这还不够,还需要添加两个task npm run buildnpm run server

"scripts": {"start": "nodemon lib/index.js --exec babel-node --presets es2015,stage-2",
+ "build": "babel lib -d dist --presets es2015,stage-2",
+ "serve": "node dist/index.js"
}

现在就可以使用npm run build累预编译了。npm run server可以在产品环境启动server。

$ npm run build
$ npm run server

这样我们就可以很快的重启server而不需要等着babel预编译文件。

刚刚新添加了dist目录,这个目录需要排除在git之外。所以给.gitignore文件添加dist

$ touch .gitignore
dist

这样就确保不会一不小心把gist的文件上传了。

把Babel选项保存到.Babelrc中

$ touch .babelrc

添加如下的配置。

{"presets": ["es2015", "stage-2"], "plugins": []
}

现在就可以在npm脚本里去掉那些多余的选项了。

  "scripts": {
+   "start": "nodemon lib/index.js --exec babel-node",
+   "build": "babel lib -d dist", "serve": "node dist/index.js"}

测试server

最后我们需要 保证server经过了严格的测试。

安装mocha

$ npm install --save-dev mocha

test/index.js里创建测试代码。

$ mkdir test
$ touch test/index.js
import http from 'http';
import assert from 'mocha';import '../lib/index.js';describe('Example Node Server', () => {it('should retur 200', done => {http.get('http://127.0.0.1:4321', res => {assert.equal(200, res.statusCode);done();});});
});

接下来安装babel-register

$ npm install --save-dev babel-register

然后添加npm test脚本。

  "scripts": {"start": "nodemon es6_express_app.js --exec babel-node","build": "babel lib -d dist","server": "node dist/index.js",+   "test": "mocha --compilers js:babel-register"}

现在来运行测试。

$ npm test

你会看到下面的内容。

server running http://localhost:4321Example Node Server✓ should return 200 (61ms)1 passing (85ms)

OK,全文完!

express下使用ES6 - dtdxrk - 博客园相关推荐

  1. 如果我是博客园的产品经理【下】

    题记 本来打算为博客园写一篇文章就算了 但有位园友提出了几个问题很有代表性 所以打算再就此写一篇 问题如下: 1.知识的分享应该是免费无私的 2.国外有很多高质量的开源项目,为什么不强制收费(而是采用 ...

  2. python博客项目评论_Python 爬虫入门——小项目实战(自动私信博客园某篇博客下的评论人,随机发送一条笑话,完整代码在博文最后)...

    之前写的都是针对爬虫过程中遇到问题的解决方案,没怎么涉及到实际案例.这次,就以博客园为主题,写一个自动私信博客下的评论人员(在本篇留下的评论的同学也会被自动私信,如果不想被私信,同时又有问题,请私信我 ...

  3. python读取数据库数据、并保存为docx_Python - 爬取博客园某一目录下的随笔 - 保存为docx...

    1 #coding:utf-8 2 importrequests3 from bs4 importBeautifulSoup4 importMySQLdb5 6 7 defget_html(url): ...

  4. .Net下的分库分表帮助类——用分库的思想来分表 - 秋夜 - 博客园

    .Net下的分库分表帮助类--用分库的思想来分表 - 秋夜 - 博客园

  5. 在Windows下配置与使用CVSNT - dudu - 博客园

    导读: dudu为程序员打杂的站长 博客园社区首页新随笔联系管理订阅 随笔- 1060 文章- 241 评论- 22227 在Windows下配置与使用CVSNT 1.下载CVSNT, 下载地址: h ...

  6. 周六(6月7日)博客园沈阳.NET俱乐部线下聚会

    ========================================================== 时间地点都已确定: 时间: 6月7日 上午 11点 - 下午 3点 地点: 沈阳市 ...

  7. Socket编程之简单介绍 - 蓝天下的雨 - 博客园

    Socket编程之简单介绍 - 蓝天下的雨 - 博客园 Socket编程之简单介绍 - 蓝天下的雨 - 博客园 Socket编程之简单介绍 2013-03-19 15:27 by 蓝天下的雨, 878 ...

  8. 分享下我的博客园CSS

    今天没事瞎折腾博客园,对于HTML,css,js等都是了解一点点. 我用的模板是: 修改后的样式为: \ css代码如下: 1 /* Minification failed. Returning un ...

  9. Silence - 专注于阅读的博客园主题

    最近花了点心思整理了下我的博客园主题代码,今天正式和大家分享一下,感兴趣的园友可以了解一下. 主题介绍 Silence 追求大道至简的终极真理,旨在打造一个干净.专注阅读的博客主题,没有二维空间元素. ...

最新文章

  1. 打开和保存文件的对话框
  2. Java 输出流中的flush方法
  3. Unity中BVH骨骼动画驱动的可视化理论与实现
  4. Android开发之和风天气篇:1、获取天气信息
  5. ajax提交数据遇到400异常,原因及解决方案
  6. 推动隐私计算技术,360数科提出分割式神经网络框架
  7. Jersey 异常处理
  8. 鲇鱼效应”也有副作用
  9. android弹出窗背景透明,Android Dialog 弹框之外的区域 默认透明背景色修改
  10. mapinfo将北京54坐标系转WGS84坐标系
  11. matlab进行道格拉斯筛选,柯布-道格拉斯(Cobb-Douglas)生产函数模型.doc
  12. Mat 无法解析dump文件:Dominator tree not available. Open the Dominator Tree or delete indices and parse aga
  13. 下载文件进度显示--小小Demo——桃先森
  14. 研报精选230215
  15. NFPA-持续为美国贡献防火国家规范的非政府协会
  16. UDT 最新源码分析(三) -- UDT Socket 相关函数
  17. 2023秋招--腾讯天美--游戏客户端--二面面经
  18. Nilsson's sequence score算法解决八数码问题解释
  19. cfd计算linux windows,[转载]实现fluent软件在windows单机系统中多核计算
  20. 【python】在图片加上数字

热门文章

  1. 金叉成功率_技巧!三分钟教会你识别macd真假金叉,让你精准把握买卖点!
  2. gson json转map_Java几种常用JSON库性能比较
  3. html5 canvas实际应用,Html5 Canvas入门及经典应用
  4. 无法复制winevt中的文件_u盘文件无法复制怎么解决 u盘文件无法复制解决方法【详细步骤】...
  5. python find函数 和index的区别_find方法和index方法的区别
  6. c语言python零基础教学_编程零基础应当如何开始学习 Python?附教程
  7. python读取日志统计ip_如何通过命令行统计和排列访问日志里的ip数
  8. java外挂源码_2.7 万 Star!Github 项目源码辅助阅读神器
  9. 【TensorFlow-windows】keras接口学习——线性回归与简单的分类
  10. 关于协方差矩阵需要注意的一个事项