webpack---webpack构建vue多页面框架（一、工程布局）

webpack+vue已经成为单页面程序标配！其实webpack构建vue多页面程序也是相当出色！
1. 工程布局；
2. webpak.config.js；
3. 生产环境与开发环境；
4. 自动化构建；
5. 源码GitHub；

---

---

1.工程布局

理想中的工程目录如下：

-app
    webpack.config.js  //webpack入口配置
    postcss.config.js  //css3兼容前缀
    package.json   //依赖json
    -dist    //打包之后根目录
        -js   //打包之后js存放
        -css   //打包之后css存放
        -views   //打包之后html存放
        -img   //打包之后 img存放
    -src  //源码，app开发过程所需一切resource
        -APPcommon  //公共部分
            -components  //常用组件
            -font  //字体部分
            -style   //重置样式，mixin
            -view  //入口html
            -modules  //常用js模块
            -lib  //js库
        -APPpages  //多页面
            -home  //home页面
            -about  //about页面
            -list  //list页面
            .....

下一章： 二. webpack.config.js