javascript - 哈巴狗 + webpack-dev-server
问题描述
我正在使用 webpack v4 并且我正在尝试使用Pug
withwebpack-dev-server
但是当我运行webpack-dev-server --mode development
它时不提供已编译Pug
的 . 请帮忙。我不知道该怎么办。谢谢您的回复。这是我的配置:
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
entry: './src/js/main.js',
output: {
path: path.join(__dirname, 'dist'),
filename: 'bundle.js'
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
},
{
test: /\.pug$/,
use: {
loader: 'pug-loader',
options: {
pretty: true
}
}
}
]
},
devServer: {
contentBase: path.join(__dirname, 'dist'),
hot: true,
open: true,
progress: true
},
plugins: [
new HtmlWebpackPlugin({
template: path.join(__dirname, 'src/templates/pages/index.pug'),
inject: false
})
]
};
解决方案
您好,您必须在 HtmlWebpackPlugin 上指定文件名,以便您可以从 localhost:3000 或 localhost:3000/index.html 提供您的 html
devServer: {
...,
port: 3000
}
...
plugins: [
new HtmlWebpackPlugin({
template: path.join(__dirname, 'src/templates/pages/index.pug'),
filename: 'index.html'
})
]
推荐阅读
- javascript - 如何避免删除数字前面的零?
- javascript - ES6 Javascript:从带有箭头函数的类中调用静态方法
- wordpress - Woocommerce 在特定产品类别及其子类别存档页面上显示小部件
- oracle - 如何使用 Oracle 中的数组反转字符串?
- java - 正则表达式不适用于单个字符
- ruby - 使用无头 chrome 浏览 spotify 显示“在浏览器中启用播放器”
- python - Python 陷阱例程
- computer-science - 如果在程序的最后一条指令执行期间发生中断,则压入堆栈的返回地址是多少?
- swt - 复制 Nattable 单元格并粘贴到 Excel 中无法正常工作
- node.js - 节点和 Twilio 集成