前端工作流 -凯发k8官方网

编译

　　babel编译：必须配置 .babelrc文件

{"presets": [],"plugins": [] }

　　presets字段设定转码规则，官方提供以下的规则集，你可以根据需要安装。

# es2015转码规则 $ npm install --save-dev babel-preset-es2015# react转码规则 $ npm install --save-dev babel-preset-react# es7不同阶段语法提案的转码规则（共有4个阶段），选装一个 $ npm install --save-dev babel-preset-stage-0 $ npm install --save-dev babel-preset-stage-1 $ npm install --save-dev babel-preset-stage-2 $ npm install --save-dev babel-preset-stage-3

　　然后写入.babelrc文件

{"presets": ["es2015","react"] }

　　babel默认只编译javascript新的语法（syntax），而不编译新的api，比如promise、maps、set等全局对象。以及一些定义在全局对象上的方法，想要这些方法在浏览器运行，就必须用babel-folyfill插件，然后再脚本头部加入代码：

import 'babel-polyfill'; // 或者 require('babel-polyfill');

模块打包

　　babel只是将es6转为es5，但是依旧是commonjs规范语法，里面的 require、exports是commonjs里的变量，babel没有模块管理的功能。

　　模块管理的工具browserify、webpack等，browserify只打包js文件，如果是一个单页的话，可以用webpack，它可以把里面的资源全部打包，包括css、图片。

任务运行

　　编译和打包都可以通过命令行来完成，但是每次都用命令行太麻烦，自动化工具gulp、grunt。

　　编译和打包都是任务，那就可以把任务在gulp里定义，并通过gulp运行。

转载于:https://www.cnblogs.com/websjs/p/9242232.html

总结

以上是凯发k8官方网为你收集整理的前端工作流的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得凯发k8官方网网站内容还不错，欢迎将凯发k8官方网推荐给好友。