首页 > Web开发 > 详细

webpack编译es6

时间:2017-07-18 12:55:56      阅读:330      评论:0      收藏:0      [点我收藏+]

1 安装

已安装npm前提下,先全局后在使用的文件夹下安装局部,npm init 初始化package.json

npm install webpack --save-dev

2 测试

技术分享         技术分享

运行后生成b.js

运行除了直接webpack命令,还可以修改package.json里面,在scripts里添加 "start":"webpack",然后npm start就可以了,npm run start一样,跟vue-cli全家桶的npm run dev一样的

报错详细,可以用webpack --display-error-details

3 配置webpack.config.js

更详细参见:http://webpack.github.io/docs/configuration.html

当入口不直接写根目录下文件时,报错,报入口模块未找到

技术分享技术分享

其实是路径问题,用上 __dirname就可以了

  3-1 多个js文件编译

    json,前是名称

    3-1-1技术分享      技术分享

    3-1-2技术分享                         技术分享

      文件合并编译了

4 编译es6 ==> es5

npm install babel-core

     babel-loader

     babel-preset-es2015       --save-dev

技术分享

配置下文件,然后就可以编译es6了

5 本地服务器

查看有无webpack-dev-server,可能是我之前全局安装过或还是这个版本就有的,然后之前的webpack改成webpack-dev-server (--progress --colors)括号里面的我不知道是啥意思,没发现作用

启动服务器跟编译没关系的??!

webpack编译es6

原文:http://www.cnblogs.com/hhweb/p/7198926.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!