weixin_57909439 2022-10-31 21:51 采纳率: 85%
浏览 5
已结题

在webpack配置中设置mode为development可以打包,但为production不可以打包

在webpack配置中设置mode为development可以打包,但为production不可以打包

webpack.common.js

const path = require("path")
const HtmlWebpackPlugin = require('html-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')

module.exports = {
    entry:'./src/main.js',
    output:{
        path:path.resolve(__dirname,'dist'),
        filename:'index.js',
        clean:true
    },
    module:{
        rules:[
            {
                test:/\.css$/,
                use:[MiniCssExtractPlugin.loader,'css-loader']
            },
            {
                test:/\.png$/,
                type:'asset',
                parser:{
                    dataUrlCondition:{
                        maxSize:60*1024
                    }
                },
                generator:{
                    filename:'static/image/[name][hash:4][ext]'
                }

            },
            {
                test: /\.mp3$/i,
                type:'asset/resource',
                generator:{
                    filename:'static/audio/[name][hash:4][ext]'
                }
                
            },
            {
                test: /\.eot|ttf|woff$/i,
                type:'asset/resource',
                generator:{
                    filename:'static/fonts/[name][hash:4][ext]'
                }
                
            }
        ]
    },
    plugins:[
        new MiniCssExtractPlugin({
            filename:'index.css'
        }),
        new HtmlWebpackPlugin({
            filename:'./index.html',
            template:'index.html'
        })
    ]
}

webpack.prod.js

const path =require('path')
const common = require('./webpack.common.js')
const {merge} = require('webpack-merge')
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");


module.exports = merge(common,{
    module:{
        rules:[ 
        ]
    },
    plugins:[
    ],
    devtool: 'source-map',
    mode:'production',
})

img

  • 写回答

1条回答 默认 最新

  • 天問_ 2022-11-01 10:32
    关注

    你这个脚手架很早了,估计好多插件不维护了,官网给的建议,最好使用 @vue/cli 脚手架,会减少很多配置。

    Vue CLI 现已处于维护模式!
    现在官方推荐使用 create-vue 来创建基于 Vite 的新项目。另外请参考 Vue 3 工具链指南 以了解最新的工具推荐。

    安装:

    npm install -g @vue/cli
    # OR
    yarn global add @vue/cli
    
    

    创建一个项目:

    vue create my-project
    # OR
    vue ui
    
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 11月9日
  • 已采纳回答 11月1日
  • 创建了问题 10月31日

悬赏问题

  • ¥15 verilog modelsim仿真
  • ¥15 Power BI 里面 帕累托图突出显示前20
  • ¥50 用预估矫正法,分数阶微分方程组传染病的最优控制代码怎么写
  • ¥15 画个数据流程图,手画也行
  • ¥60 AS自带模拟器AVD Root 和 Xposed安装
  • ¥30 哪位搞Android的编程师可以帮我远程一下,悬赏30元
  • ¥15 solidity部署上合约,可以mint,也继承接口了,在区块链也不显示代币名字
  • ¥15 讨论 博士论文交互项怎么讨论?
  • ¥50 在集成BiLSTM和GCN模型时遇到了问题
  • ¥33 集成BiLSTM模型和GCN模型时,前模型的输出不匹配后模型的输入