分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 前端开发

webpack 配置

发布时间:2023-09-06 01:40责任编辑:蔡小小关键词:配置webpack

三、配置发布阶段的脚本和配置文件

1、根目录下新建文件:

webpack.pub.config.js

2、在 package.json 中配置启动命令

"pub": "webpack --config webpack.pub.config.js"

3、配置方案

const path = require(‘path‘);// 在内存中生成一份 HTML 代码,const htmlWebpackPlugin = require(‘html-webpack-plugin‘);module.exports = { ???// 入门文件 ???entry: path.join(__dirname, ‘./src/main.js‘), ???// 打包后文件的存放目录 ???output: { ???????path: path.join(__dirname, ‘./dist‘), ???????filename: ‘bundle.js‘ ???}, ???// 插件 ???plugins: [ ???????new htmlWebpackPlugin({ ???????????template: path.join(__dirname, ‘./src/index.html‘), ???????????filename: ‘index.html‘ ???????}) ???], ???module: { ???????rules: [ ???????????{ test: /\.css$/, use: [‘style-loader‘, ‘css-loader‘] }, ???????????{ test: /\.scss$/, use: [‘style-loader‘, ‘css-loader‘, ‘sass-loader‘] }, ???????????// limit 大于 5000,的图片,保留8位哈希,以本本来的名字和后缀结尾 ???????????{ test: /\.(png|gif|bmp|jpg)$/, use: ‘url-loader?limit=5000&name=[hash:8]-[name].[ext]‘}, ???????????{ test: /\.js$/, use: ‘babel-loader‘, exclude: /node_modules/ } ???????] ???}}

webpack 配置

原文地址:https://www.cnblogs.com/guashi/p/8401714.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved