徐姣 2016-12-22

在项目开发过程中有很多重复搭建构建环境的情况，这里独立出一个通用的手脚架，欢迎使用~

• src : 开发目录
• build :构建目录
• temp：临时性目录

• 利用webpack打包静态资源

  • 这里除了组件会把所有资源（css/js/img）打包成js，其他的情况下，还是采用gulp对对应的资源处理

• 基于gulp的自动化流程构建（监听资源变化、自动刷新浏览器等）

• 监听相应文件变化、自动刷新浏览器

• 基于ES6开发

• 2016-12-22

  • 创建基础目录

• 2016-12-23

  • browsersync浏览器同步刷新
  • 基于webpack的模块化管理

• 2016-12-24

  • 添加任务--sass预编译，css添加浏览器前缀以及压缩

• 2016-12-27

  • 监听js模块变化，预编译并打包
  • 添加删除文件夹任务（删除临时文件夹）

• 安装依赖时哪些应该执行--save-dev 哪些应该执行--save

  执行--save-dev将依赖更新至package.json的devDependencies，但是--save将依赖更新至dependencies。两者有什么区别呢？devDependencies下面的依赖时我们开发时候用的。而dependencies 下的模块，则是我们发布后还需要依赖的模块，譬如像jQuery库或者Angular框架等。

• webpack.js和gulpfile.js都是基于es6写的，那如何在执行命令前编译了这两个文件

  在根目录下使用webpack.config.babel.js以及gulpfile.babel.js代替上面两个文件

• config.json文件里，厉害了，我用写js的注释在这里写了注释！报错！！！

• 如何理解webpack配置文件中的entry

  • 我理解的是：entry是入口，也就是在这里我们来配置需要webpack处理的文件，我希望可以是一个文件、或者一个文件夹，或者是通过正则校验的一组(没找到可以正则匹配的方法)
  • 官方定义：
    • entry是模块的入口
    • entry取值可以是：字符串（对应的模块在启动时加载） 数组（数组内所有的模块在启动时加载,所有模块都是启动时加载，模块导出到最后一个里面）对象（可以构建多个bundle,就会创建多个输入包文件，对象键值就chunk的name，值可以是字符串或者是数组）

• webpack的如果命令写在package.json的script里，运行npm run xxx来打包出错，命令行不报错，就停在那，不开心。

• use gulp