webpack配置

var path = require(‘path’);
var MiniTextPlugin = require(‘mini-css-extract-plugin’);
var uglifyjs = require(‘uglifyjs-webpack-plugin’);
var HtmlWebpackPlugin = require(‘html-webpack-plugin’);

module.exports = {
entry: ‘./src/main.js’,
output: {
filename: ‘bundle.js’,
path: path.resolve(__dirname, ‘dist’),
// publicPath: ‘http://localhost:8080’,
},
module: {
rules: [
{
test: /.lessKaTeX parse error: Expected 'EOF', got '}' at position 83: …'] }̲, {…/,
use: [‘style-loader’, ‘css-loader’]
},
// js loaders
{
test: /.jsKaTeX parse error: Expected 'EOF', got '}' at position 219: …s/ }̲, /…/,
use: [
{
loader: ‘file-loader’,
options: {
name: “[name].html”
}
},
{
loader: “extract-loader”
},
{
loader: “html-loader”,
options: {
attrs: [“img:src”]
}
}

            ]
        },
        // img-loader
        {
            test: /\.(jpg|png|gif)$/,
            use: [
                {
                    loader: 'file-loader',
                    options: {
                        name: 'img/[name]-[hash:8].[ext]'
                    }
                }
            ]
        }
    ]
},
plugins: [
    // 单独打包css
    new MiniTextPlugin({
        // 从.js文件中提取出来的.css文件名称
        filename: '[name]_[contenthash:8].css',
        // chunkFilename:'[id].css'
    }),
    // 压缩css
    new uglifyjs(),
    new HtmlWebpackPlugin({
        title: 'tittle',
        template: './src/demo.html',
        // minify: {
        //     collapseWhitespace: true
        // },
        // hash: true
    })
],
mode: 'development'

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值