let path = require('path');
let htmlWebpackPlugin = require('html-webpack-plugin');
let vueLoaderPlugin = require('vue-loader/lib/plugin');

module.exports = {
    entry: {
        // ceshi: "./src/ceshi.js",
        main: "./src/main.js"
    },
    mode: "development",
    
    output: {   // 指定输出选项
        filename: "[name].js",
        path: path.resolve(__dirname, 'dist'),
    },
    
    plugins: [  // 所有webpack插件的配置节点
        new htmlWebpackPlugin({
            template: path.resolve(__dirname, './src/index.html')
            // filename: "index.html"
        }),
        // news htmlWebpackPlugin({
        //     template: path.resolve(__dirname, './src/ceshi.html'),
        //     filename: 'ceshi.html'
        // })

        // 配置runtime-only环境中渲染组件的插件
        new vueLoaderPlugin()
    ],

    module: {   // 配置所有第三方loader
        rules: [

            // vue-loader 依赖包 vue-template-compiler，不用配置，内部自动依赖
            {test: /\.vue$/, use: 'vue-loader', exclude: /node_modules/},
            // 处理 css 文件
            {test: /\.css$/, use: ['style-loader', 'css-loader']},
            {test: /\.scss$/, use: ['style-loader', 'css-loader','sass-loader']},
            // 处理字体文件
            {test: /\.(ttf|eot|svg|woff|woff2)$/, use: 'url-loader'},
            // 处理文件和图片的loader
            {test: /\.(jpg|png|gif|bmp|jpeg)$/, use: 'url-loader'}
        ]
    },

    resolve: {
        alias: {
            // 如果导入的模块以 vue 结尾，则修改其引用的vue文件路径
            // "vue$": "vue/dist/vue.js",
        }
    }
};