dahong
dahong copied to clipboard
shaodahong
boarder，快速开始一个webpack项目-介绍篇
现在许多的项目都是基于webpack来构建的，并且自从webpack提供了中文官网后友好度大大的提高了，但是有些时候想快速开始一个webpack项目却只能把之前项目的一些config配置拿过来改改显得有点麻烦，所以写了一个简易的脚手架（真的很简易！！！）
安装：
$ npm install boarder -g
使用：
$ boarder init <项目名>
$ cd <项目名>
$ npm install
$ npm run dev
初始化的结构目录是这样子的
├── README.md
├── build
│ ├── webpack.base.js
│ ├── webpack.build.js
│ └── webpack.dev.js
├── dist
│ ├── index.html
│ └── static
│ └── js
├── package-lock.json
├── package.json
└── src
├── assets
├── index.html
└── index.js
目录结构还是很简单的
-
build存放着构建相关的代码 -
src存放着开发相关的代码，初始化了两个文件index.html和index.js，index.js是项目的主入口，如果index.js这个名字不喜欢，那么你修改了最后也要把build-webpack.base.js里面entry的入口名字改掉
功能实现：
- [X] 支持
ES6写法，通过Babel来转换 - [X] 支持小图片自动转Base64
- [X] 支持业务和依赖代码的分离
- [X] 支持热更新
- [ ] 支持
Sass,Stylus或者Less - [ ] 优化构建速度
css预处理器本身不太想集成，因为每个业务中需要用到的预处理器都是不一样的，但是考虑到常用的预处理器就那么几种，所以接下来也会集成
构建的速度肯定是需要优化的，本身boarder这个包初始化还不是很完善，其实我只要一个目的就是当你没有明确用的框架的时候boarder init一个是可以快速来生成一个webpack项目的，如果有明确的框架，肯定是框架同款的cli好用，比如vue-cli和ng-cli这些
如果你在项目中使用boarder有相关的问题可以给我提issues
boarder issues
webpack模板 issues
初始化报错，无法完成。 e:\webpack-boarder>boarder init my-project run C:\Users\Administrator.boarder-templates\my-project wdemo e:\webpack-boarde r\my-project err { RequestError at ClientRequest.req.once.err (C:\Users\Administrator\AppData\Roaming\npm\no de_modules\boarder\node_modules\got\index.js:73:21) at Object.onceWrapper (events.js:316:30) at emitOne (events.js:115:13) at ClientRequest.emit (events.js:210:7) at TLSSocket.socketErrorListener (_http_client.js:400:9) at emitOne (events.js:115:13) at TLSSocket.emit (events.js:210:7) at emitErrorNT (internal/streams/destroy.js:62:8) at _combinedTickCallback (internal/process/next_tick.js:102:11) at process._tickCallback (internal/process/next_tick.js:161:9) code: 'UNABLE_TO_VERIFY_LEAF_SIGNATURE', message: 'unable to verify the first certificate', host: 'github.com', hostname: 'github.com', method: 'GET', path: '/shaodahong/wdemo/archive/master.zip', bufferedData: <Buffer > }
