/**
 * webpack config
 * @author: shenzm<zhimin.shen@yoho.cn>
 * @date: 2017/3/21
 */

'use strict';

const webpack = require('webpack');
const path = require('path');
const _ = require('lodash');
const shelljs = require('shelljs');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const postcssConfig = require('./postcss.config.js');
const scss = require('postcss-scss');

const entries = {
    'index': path.join(__dirname, '../scss/index.css'),
    'common': path.join(__dirname, '../scss/common.css'),
    'feature': path.join(__dirname, '../scss/feature.css')
};

// 构建各模块子页面JS。生成规则module.page.js
shelljs.ls(path.join(__dirname, '../js/**/*.page.js')).forEach((f) => {
    const dir = _.slice(f.split('/'), -2); // [modulename, xx.page.js]

    // Important
    // 生成规则：module.page: './js/module/xx.page.js'
    entries[`${dir[0]}.${dir[1].match(/(.*).page.js/)[1]}`] = path.join(__dirname, `../js/${dir.join('/')}`);
    entries.libs = [
        'yoho-jquery'
    ];
});

module.exports = {
    entry: entries,
    output: {
        path: path.join(__dirname, 'bundle'), // absolute path
        filename: '[name].js'
    },
    module: {
        rules: [{
            test: /\.vue$/,
            use: [{
                loader: 'vue-loader',
                options: {
                    postcss: {
                        plugins: postcssConfig.postcssPlugin('dev'),
                        parser: scss
                    },
                    autoprefixer: false,
                    loaders: {
                        css: ExtractTextPlugin.extract({
                            fallback: 'vue-style-loader',
                            use: [{
                                loader: 'css-loader',
                                options: {
                                    url: false
                                }
                            }]
                        })
                    }
                }
            }],
        }, {
            test: /\.js$/,
            exclude: [/node_modules/],
            use: [{
                loader: 'babel-loader'
            }]
        }, {
            test: /\.css$/,
            use: ExtractTextPlugin.extract({
                fallback: 'style-loader',
                use: [{
                    loader: 'css-loader',
                    options: {
                        url: false
                    }
                }, {
                    loader: 'postcss-loader',
                    options: {
                        plugins: postcssConfig.postcssPlugin('dev'),
                        parser: scss
                    }
                }],
            })
        }, {
            test: /\.hbs$/,
            use: [{
                loader: 'handlebars-loader',
                options: {
                    helperDirs: [
                        path.join(__dirname, '../js/common/helpers')
                    ],
                    partialDirs: [
                        path.join(__dirname, '../../doraemon/views/partial')
                    ]
                }
            }]
        }]
    },
    resolve: {
        modules: ['node_modules', './public/vue', './public/hbs', './public/scss', './public/js'],
        alias: {
            js: path.join(__dirname, '../js/'),
            vue: 'vue/dist/vue.js'
        }
    },
    plugins: [
        new ExtractTextPlugin('[name].css'),
        new webpack.optimize.CommonsChunkPlugin({
            name: 'libs',
            filename: 'libs.js'
        }),
        new webpack.ProvidePlugin({
            $: 'yoho-jquery',
            jQuery: 'yoho-jquery',
            'window.jQuery': 'yoho-jquery'
        })
    ]
};