账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    webpack4的SplitChunksPlugin配置不生效
    32
    0

    两个入口文件都引入了Vue,App,router,但打包没提取,配置有什么问题吗?见代码

    three.js

    import Vue from 'vue'
    import App from './App'
    import router from './router'
    Vue.config.productionTip = true
    /* eslint-disable no-new */
    new Vue({
        el: '#app',
        router,
        components: { App },
        template: '<App/>'
    })

    main.js

    import Vue from 'vue'
    import App from './App'
    import router from './router'
    Vue.config.productionTip = true
    /* eslint-disable no-new */
    new Vue({
        el: '#app',
        router,
        components: { App },
        template: '<App/>'
    })

    webpack.config.js

    'use strict'
    const path = require('path')
    const HtmlWebpackPlugin = require('html-webpack-plugin')
    const VueLoaderPlugin = require('vue-loader/lib/plugin')
    const CleanWebpackPlugin = require('clean-webpack-plugin')
    const CopyWebpackPlugin = require('copy-webpack-plugin')
    const webpack = require('webpack')
    const ZopfliPlugin = require("zopfli-webpack-plugin")
    const utils = require('./build/utils')
    // const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
    module.exports = {
        context: path.resolve(__dirname, './'),
        devtool: 'inline-source-map',
        mode: 'development',
        resolve: {
            extensions: [".js", ".vue"],
            alias: {
                "@": path.resolve(__dirname, 'src'),
                "vue$": 'vue/dist/vue.esm.js'
            }
        },
        entry: {
            test: './src/main.js',
            three: './src/three.js'},
        output: {
            filename: '[name].bundle.js',
            path: path.resolve(__dirname, "dist")
        },
        module: {
            rules: [
                {
                    test: /\.js$/,
                    loader: 'eslint-loader',
                    enforce: 'pre',
                    include: path.resolve(__dirname, 'src'),
                    options: {
                        formatter: require('eslint-friendly-formatter')
                    },
                    exclude: /node_modules/
                },
                {
                    test: /\.js$/,
                    loader: 'babel-loader',
                    include: path.resolve(__dirname, 'src'),
                    exclude: /node_modules/
                },
                {
                    test: /\.vue$/,
                    loader: 'vue-loader',
                    include: path.resolve(__dirname, 'src'),
                    exclude: /node_modules/
                },
                {
                    test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
                    loader: 'url-loader',
                    options: {
                        limit: 10,
                        name: utils.assetsPath('img/[name].[hash:7].[ext]')
                    }
                },
                {
                    test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
                    loader: 'url-loader',
                    options: {
                        limit: 10000
                    }
                },
                {                       
                    test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
                    loader: 'url-loader',
                    options: {
                        limit: 10000
                    }   
                },
                {
                    test: /\.css$/,
                    use: [
                        'vue-style-loader',
                        {
                            loader: 'css-loader',
                            options: { importLoaders: 1 }
                        },
                        'postcss-loader'
                    ]
                },
                {  
                    test: /\.(htm|html)$/i,  
                    use:[ 'html-withimg-loader']   
                } 
            ]
        },
        plugins: [
            new VueLoaderPlugin(),
            new HtmlWebpackPlugin({
                filename: 'index.html',  
                inject: true,  
                template: 'index.html',  
                chunks: ['test'],  
                inlineSource: '.(js|css)$' 
            }),
            new HtmlWebpackPlugin({
                inject: true,  
                filename: 'three.html',  
                template: "three.html",  
                chunks: ['three'],  
                inlineSource: '.(js|css)$' 
            }),
            new webpack.HotModuleReplacementPlugin(),
            new webpack.optimize.SplitChunksPlugin({
                chunks: "all",
                name: true
            })
            // new BundleAnalyzerPlugin()
        ]
    }
    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部