const page = require('../controller/index');
module.exports = [
    {path: '', ctrl: page.home},
    {path: 'main', ctrl: page.home},
    {path: 'api/list', ctrl: page.list, method: 'post'}
];

const api = require('../api/index');
class page {
    async home(ctx, _next) {
        let locals = {
            appId: 'home',
            title: 'home-page'
        };
        //按需加载下必填,否则可忽略.
        ctx.state.appKey = 'home/index';
        //中台获取数据
        let data = await api.getList(ctx);
        ctx.state.list = data;
        //使用common通用视图
        await ctx.render('pages/common', locals);
    }

    async list(ctx, _next) {
        let locals = {
            list: await api.getList(ctx)
        };
        ctx.body = locals;
    }
}
module.exports = new page();

...
<script>
    export default {
        appId: 'home', //必填,入口根据此ID渲染
        data () {
            return {
                list: ''
            }
        },
        mounted(){
            this.$http.post('/api/list').then(response => {
                console.log(response);
                this.list = response.data.list
            }, response => {
                console.log(response);
            })
        }
    }
</script>
...

module.exports ={
    header: './web/entry/header.js', //全局头部通用文件(引用vue,全局样式...)
    // footer: './web/entry/footer.js', //全局底部通用文件(比如统计数据...)
};

module.exports ={
    entry: {
        'app': './web/pages/app/index.js',
        'app2': './web/pages/app2/index.js',
    },
    //devtool: '#cheap-module-eval-source-map'
    ...
};

entry: {
    'app': [
        './web/entry/header.js', 
        './web/entry/footer.js' , 
        './web/pages/app/index.js' , 
        'webpack-hot-client/client'
    ],
    'app2': [
        './web/entry/header.js', 
        './web/entry/footer.js' , 
        './web/pages/app/index.js' , 
        'webpack-hot-client/client'
    ]
}

module.exports ={
    ...
   new ManifestPlugin({
       publicPath: '/dist/'
   })
    ...
};

entry: {
    'app': ['./web/pages/app/index.js'],
    'app2': ['./web/pages/app2/index.js'],
    header: ['./web/entry/header.js'],
    footer: ['./web/entry/footer.js']
}

{{{parseUrl 'app.css' 'app.js'}}}

{{{mountState}}}   //将ctx.state挂载到window.APPSTATE

<script type="text/javascript">
window.APPSTATE = {
    locale:'zh',
    publicServer:'',
    appName:'app'
}
</script>

{{{parseUrl 'header.css' 'header.js'}}}

Mock.mock('/api/list', 'post', function () {
    return Mock.mock({
        "list|5-10": [{
            'name': '@cname',
            'imageUrl': 'http://placehold.it/300x150/f69/fff',
            'description': '@cname'
        }]
    });
});

window.locale = {
    'desc': 'vue koa 多页应用脚手架'
};

window.locale = {
    'desc': 'vue koa scaffold'
};

/**
 * 获取locale对应的值 
 */
window.getLocale = function (key) {
    if (window.locale) {
        return window.locale[key] || '';
    }
    else {
        return key;
    }
};

...
data() {
    return {
        list: '',
        desc: getLocale('desc')
    }
}
...

//动态加载