loit-web-component-gx/webpack.config.js

广西时代凌宇前端组件库

const path = require("path");
const webpack = require("webpack");
const CopyWebpackPlugin = require('copy-webpack-plugin');
 
module.exports = {
    devtool: 'source-map',
    entry: "./src/components/index.js",//入口文件，就是上步骤的src目录下的index.js文件，
    output: {
        path: path.resolve(__dirname, './dist'),//输出路径，就是上步骤中新建的dist目录，
        publicPath: '/dist/',
        filename: 'loitWeb-gx.min.js',
        libraryTarget: 'umd',
        umdNamedDefine: true,
        // clean: true,            // 在生成文件之前清空 output 目录 5.20.0+
    },
    module: {
        rules: [{
                test: /\.vue$/,
                loader: 'vue-loader'
            },
            {
                test: /\.s[ac]ss$/,
                use: [
                    { loader: "style-loader" },
                    { loader: "css-loader" },
                    { loader: "sass-loader" }
                ]
            },
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'babel-loader'
            },
            {
                test: /\.(png|jpe?g|gif|svg|webp|eot|ttf|woff2?)$/,
                loader: 'url-loader',
                query: {
                    limit: 30000,
                    name: '[name].[ext]?[hash]'
                },
            },
        ]
    },
    plugins: [
        new webpack.DefinePlugin({
            "process.env": {
                NODE_ENV: JSON.stringify("production")
            }
        }),
        new CopyWebpackPlugin([
            {
                //输出外部配置文件
                from: path.resolve(__dirname, "./src/config/env.js"),
                to: 'config/env.js',
                ignore: ['.*']
            }
         ]),
    ],
    externals: {
        /**
         * externals 对象属性解析。
         *  基本格式：
         *     '包名' : '在项目中引入的名字'
         *  
       */
       'vue': 'Vue',
       'echarts' : 'echarts',
       'element-ui': 'ElementUI',
       'vue-quill-editor': 'QuillEditor',
       'maptalks' : 'maptalks',
       'axios' : 'axios',
       'jquery': 'jquery',
       'js-base64': 'js-base64'
     },
    resolve: {
        //以下配置使得没有指定文件后缀名时按如下类型查找匹配
        extensions: [
            '.js','json','.vue'
        ],
        alias: {
            '@': path.resolve('./src'), // 使用别名简化相对路径
        }
    }
};