webpack.common.config.js

58 阅读1分钟

/**

  • Created by z674144 on 2019/3/25 */ const path = require('path'); const autoPreFixer = require('autoprefixer'); const tsImportPluginFactory = require('ts-import-plugin'); const webpack = require('webpack'); const CopyWebpackPlugin = require('copy-webpack-plugin');

let BUILD_ENV = 'pro'; // 默认编译环境为生产环境 if (process.env.BUILD_ENV) { BUILD_ENV = process.env.BUILD_ENV; }

let configFile = require('../env/'+ BUILD_ENV + '.json');

module.exports.common = { entry: { 'index': path.join(__dirname, '../src/index.tsx') }, output: { path: path.join(__dirname, '../output'),

    //主入口文件名和懒加载小js文件名的命名方式不一致
    filename: 'src/js/[name]-[hash].js',  //主入口文件的命名,
    chunkFilename: 'src/js/[name]-[chunkhash].js' //非主入口文件命名.打包require.ensure方法中引入的模块
},
resolve: {
    extensions: ['.ts', '.tsx', '.js', '.jsx']
},
module: {
    rules: [
        {
            test: /\.js$/,
            use: ["source-map-loader"],
            exclude: /node_modules/,
            enforce: "pre"
        },
        {
            test: /\.(tsx|ts)?$/,
            exclude: /node_modules/,
            use : [
                {
                    loader: 'react-hot-loader/webpack',
                },
                {
                    loader: 'ts-loader',
                    options: {
                        transpileOnly: true
                        // getCustomTransformers: () => ({
                        //     before: [ tsImportPluginFactory({
                        //         libraryDirectory: 'es',
                        //         libraryName: '@cmbcc/bluewhale-react',
                        //         style: 'css',
                        //     }) ]
                        // })
                    }
                },
                {
                    loader: 'tslint-loader'
                }
            ]

        },
        {
            test: /\.css$/i,
            use: [
                'style-loader',
                {
                    loader: 'css-loader',
                    options: {
                        import: true
                    }
                },
                {
                    loader: 'postcss-loader',
                    options: {
                        plugins: function () {
                            return [autoPreFixer];
                        }
                    }
                }
            ]
        },
        { // url-loader比file-load更细粒度
            test: /\.(jpg|png|eot|svg|[ot]tf|woff2?)(\?v=\d+\.\d+\.\d+)?$/,
            use: [
                {
                    loader: 'url-loader',
                    options: {
                        limit: '5120', // 5KB
                        name: 'pic/[hash:8].[name].[ext]'
                    }
                }
            ]
        }
    ]
},
plugins: [
    new webpack.DefinePlugin({
        ENV_CONFIG: JSON.stringify(configFile),
        ENV: JSON.stringify(BUILD_ENV)
    }),
    new CopyWebpackPlugin([
        {
            from: path.resolve(__dirname, '../static/'),
            to: path.resolve(__dirname, '../output/static/')
        }
    ])
]

};