'use strict';

const path = require('path');
const utils = require('./utils');
const config = require('../config');
const vuxLoader = require('vux-loader');
const vueLoaderConfig = require('./vue-loader.conf');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

function resolve(dir) {
    return path.join(__dirname, '..', dir);
}

const webpackConfig = {
    entry: {
        app: './src/main.js'
    },
    output: {
        path: config.build.assetsRoot,
        libraryTarget: 'umd',
        filename: '[name].js',
        publicPath: process.env.NODE_ENV === 'production'
            ? config.build.assetsPublicPath
            : config.dev.assetsPublicPath
    },
    resolve: {
        extensions: ['.js', '.vue', '.json', '. ' +
        ''],
        alias: {
            'vue$': 'vue/dist/vue.esm.js',
            '@': resolve('src'),
        }
    },
    devServer: {},
    module: {
        rules: [
            // {
            //   test: /\.(js|vue)$/,
            //   loader: 'eslint-loader',
            //   enforce: 'pre',
            //   include: [resolve('src'), resolve('test')],
            //   options: {
            //     formatter: require('eslint-friendly-formatter')
            //   }
            // },
            {
                test: /\.vue$/,
                loader: 'vue-loader',
                options: vueLoaderConfig
            },
            {
                test: /\.js$/,
                loader: 'babel-loader',
                include: [resolve('src'), resolve('test')]
            },
            {
                test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
                loader: 'url-loader',
                options: {
                    limit: 10000,
                    name: utils.assetsPath('img/[name].[hash:5].[ext]')
                }
            },
            {
                test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
                loader: 'url-loader',
                options: {
                    limit: 10000,
                    name: utils.assetsPath('media/[name].[hash:5].[ext]')
                }
            },
            {
                test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
                loader: 'url-loader',
                options: {
                    limit: 10000,
                    name: utils.assetsPath('fonts/[name].[hash:5].[ext]')
                }
            },
            {
                test: /\.(eot|svg|ttf|woff|woff2)$/,
                loader: 'file-loader'
            },
            {
                test: /\.css$/,
                loader: 'style-loader!css-loader!postcss-loader'
            },
            {
                test: /vux.src.*?js$/,
                loader: 'babel'
            }
        ]
    },
    externals: {
        'vue': 'Vue',  // key 代表包名， val 代表 引用的全局对象
        'vuex': 'Vuex',
        'vue-router': 'VueRouter',
        'fastclick': 'FastClick',
        'echarts': "echarts"
    }
};


// vux-loader的相关配置，详情可见其官网
module.exports = vuxLoader.merge(webpackConfig, {
        plugins: [
            'vux-ui',
            {
                name: 'duplicate-style',
                envs: ['production']
            },
            {
                name: 'less-theme',
                path: 'src/style/theme.less' // 主题的切换
            },
            {
                name: 'style-parser',
                fn: function (source) {
                    if (this.resourcePath.replace(/\\/g, '/').indexOf('/vux/src/components') > -1) {
                        return source;
                    }
                    // 对于自己项目的转换
                    return "@import '" + resolve('src/style/variable.less') + "';" + source;
                }
            }
        ]
    }
);