分享一个全栈启用 ES6、7 的开发模式（后端 sails+前端+babel），用了 async 写异步，倍爽！
xunuoi · 2015-11-18 16:09:03 +08:00 · 8482 次点击这是一个创建于 3294 天前的主题，其中的信息可能已经有所发展或是发生改变。
这个 https://github.com/xunuoi/sails-babel
后端 sails ，用了一个 babel 的 hook 来启用 ES6\7 特性，具体配置可以去查询 babel~
前端用了 babel+browserify+scss 等~~
感觉还不错，开发体验倍爽！可以直接 async 来写异步了，再不用 N 多回调！
不过搭建起来还是有点折腾的~~
后端 sails ，用了一个 babel 的 hook 来启用 ES6\7 特性，具体配置可以去查询 babel~
前端用了 babel+browserify+scss 等~~
感觉还不错，开发体验倍爽！可以直接 async 来写异步了，再不用 N 多回调！
不过搭建起来还是有点折腾的~~
第 1 条附言 · 2015-11-18 18:26:06 +08:00
附上配套的搭建和使用 sails-bable 的教程： http://karat.cc/article/562f6f53d6db69011de1bbe0
github: https://github.com/xunuoi/sails-babel
github: https://github.com/xunuoi/sails-babel
第 2 条附言 · 2015-12-31 11:51:28 +08:00
babel 6 这段时间发布了，改成做平台+插件的方式了。。。。汗
ES6 的童鞋们准备好再次折腾吧
ES6 的童鞋们准备好再次折腾吧
 |
1
xunuoi OP P.S : 这个前端的资源构建是基于 gulp 构建的，比 grunt 那套简单、清爽好多
|
|
2
xunuoi OP 附上配套的搭建和使用 sails-bable 的教程： http://karat.cc/article/562f6f53d6db69011de1bbe0
|
 |
3
wangxiao2015 2015-11-18 16:29:43 +08:00
麻烦测试一下，前端通过 babel 支持 async/await 么？后端倒是很容易支持。
|
 |
4
robertlyc 2015-11-18 16:36:29 +08:00
这个世界已经进化到 webpack 都快过时了 呵呵
|
|
5
wangxiao2015 2015-11-18 17:09:59 +08:00
@robertlyc Webpack 可以和 babel-loader 用， Babel 官方支持的。构建工具无所谓过不过时，关键是好不好用。比如 Gulp 比 Grunt 明显好用很多，那就迁移到 Gulp 。但是 Browserify 和 Webpack 差不多，所以就无所谓迁移。
|
 |
6
liuxey 2015-11-18 17:28:17 +08:00  3
有一次看到一同事句尾从来不写分号，
我就问他为什么这么做，他说标准就是不加， 然后我尝试着更改自己的习惯终于也不加分号， 过了一段时间发现同事句尾都又加分号了， 我又问了，他说现在流行加 |
 |
8
liuzhen 2015-11-18 17:51:38 +08:00
根本看不懂你们在讨论什么。
这两年前端变化太快了 跟不上节奏 |
|
9
xunuoi OP @wangxiao2015
通过 babel 都可以使用的，在 gulp 文件中配置你想要的特性就可以： var babelOptional = [ "es7.asyncFunctions", "es7.objectRestSpread", "es7.functionBind", "es7.comprehensions", ] 完整代码戳： https://github.com/xunuoi/sails-babel/blob/master/assets/gulpfile.js 和 教程 http://karat.cc/article/562f6f53d6db69011de1bbe0 当然先去熟悉下 babel 再搞起比较好： babeljs.io |
|
10
wangxiao2015 2015-11-18 18:06:00 +08:00
@xunuoi Babel6 对于 async/await 的支持还是有点问题的吧？要不就是我没配置好，我在官方建了一个 issue ，感兴趣的也可以一起跟进下。 https://github.com/babel/babel-loader/issues/161
|
|
11
xunuoi OP @wangxiao2015
你看下你发的那个 github ， 这个 babel-loader 是 Webpack plugin for Babel ，是个 Webpack 的，所以不清楚这个支持的怎么样~~ 我分享的这个是 gulp 的，需要配置好 polyfill ，然后在前端 ES6 文件中，额外 import 一下，这样就完全支持 es6\7 的 async 、 generator 等特性，亲测试过了丫，可以用滴~~要不你再看一下你的配置和官方文档 |
|
12
wangxiao2015 2015-11-18 18:13:19 +08:00
@xunuoi 好的，也可能我这边配置太多了，互相影响了，我再看看。
|
|
13
xunuoi OP 前端用 async 的话，需要额外引入 babel/polyfill 这个东西，编译后也会打包进 js 文件~~建议前端启用 async 慎用
|
|
15
xunuoi OP @wangxiao2015 恩你找下 webpack 相关的吧，看看有没有解决~我记得 webpack 打包有个问题，不支持在一个 html 中多模块打包（输出多个模块包），在 google 上搜索后，发现 webpack 是不支持的，不知道现在增加支持了没
|
|
16
xunuoi OP @nigelvon 哈哈、我现在不用分号了，外加 es6 引用了很多 python 语法，比如 yield 、 import 、 async 、 await 、修饰符等，写的 ES6 的代码，乍一看跟 Python 似得。。。
|
 |
18
ChiangDi 2015-11-18 20:54:03 +08:00
坚持不加分号。
|
|
19
xunuoi OP @longaiwp 哈哈~ JS 现在新版语法，啥都借鉴，好的特性都借鉴，比如 python 的修饰器神马的~~ 其实语言特性都是皮毛，很多语言都是想通的，核心还是各种算法、解决方案、思路等~
|
 |
22
magicdawn 2015-11-20 10:54:21 +08:00
|
|
23
xunuoi OP @magicdawn TJ 在评论里 只是偏主观的觉着 babel 来编译有点麻烦、使人疑惑，想等到 async/await 在 node 原生支持后再用到他的框架中，但其实没有讲用 babel 的实际缺点（比如性能、维护性等），他不用 babel 在 sever 端也没讲原因~~ 其实 babel 编译后的代码，是优化的，比如启用 babel 的闭包清除插件后，会将闭包函数修改成普通函数+传参的形式，这个对 V8 等引擎中运行是有性能提高的~~
|
 |
26
klesh 2015-11-21 11:02:41 +08:00
调试会很麻烦吧？能不能反馈原始代码的行数。
|
 |
28
flw01 2015-11-25 17:24:12 +08:00
我们现在在招 node.js,坐标广州，感兴趣的私聊我， http://www.lagou.com/jobs/1284459.html
|
 |
29
0rangeT1ger 2015-11-26 17:22:50 +08:00
@wangxiao2015 可以支持的, babel 5.8.x 加个 require("babel/polyfill");就行.
|
Select Language