Javascript HtmlWebpackPlugin-错误中的错误:加载程序;[…]/html网页包插件-/lib/loader.js/[…]/src/index.html“;没有';t返回html
我正在尝试使用Javascript HtmlWebpackPlugin-错误中的错误:加载程序;[…]/html网页包插件-/lib/loader.js/[…]/src/index.html“;没有';t返回html,javascript,webpack,build,Javascript,Webpack,Build,我正在尝试使用HtmlWebpackPlugin加载HTML模板,但它似乎不起作用。如果我尝试在没有参数的情况下加载插件,它就会工作。有什么想法吗 我尝试加载的index.html文件位于正确的位置,这只是为了考虑一下 package.json: { ... "devDependencies": { "@babel/core": "^7.7.4", "@storybook/html": "^5.2.8", "babel-loader": "^8.0.6",
HtmlWebpackPlugin
加载HTML模板,但它似乎不起作用。如果我尝试在没有参数的情况下加载插件,它就会工作。有什么想法吗
我尝试加载的index.html文件位于正确的位置,这只是为了考虑一下
package.json:
{
...
"devDependencies": {
"@babel/core": "^7.7.4",
"@storybook/html": "^5.2.8",
"babel-loader": "^8.0.6",
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"css-loader": "^3.2.1",
"html-webpack-plugin": "^3.2.0",
"mini-css-extract-plugin": "^0.8.0",
"node-sass": "^4.13.0",
"sass-loader": "^8.0.0",
"style-loader": "^1.0.1",
"ts-loader": "^6.2.1",
"typescript": "^3.7.3",
"webpack": "^4.41.2",
"webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.9.0"
},
"dependencies": {
"axios": "^0.19.0"
}
}
webpack.config.js:
const path = require('path');
const webpack = require('webpack');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
mode: 'development',
entry: './src/index.ts',
devtool: 'source-map',
output: {
filename: '[name].js',
path: path.resolve(__dirname, 'dist')
},
module: {
rules: [
{
test: /\.s[ac]ss$/i,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader'
},
{
loader: 'sass-loader'
}
]
},
{
test: /.(ts|tsx)?$/,
loader: 'ts-loader',
include: [path.resolve(__dirname, 'src')],
exclude: [/node_modules/]
}
]
},
plugins: [
new webpack.ProgressPlugin(),
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'src/index.html'
}),
new MiniCssExtractPlugin({
filename: '[name].css'
})
],
devServer: {
hot: true,
host: '0.0.0.0'
},
resolve: {
extensions: ['.tsx', '.ts', '.js', '.scss', '.css']
}
};
从
不要设置任何加载程序
默认情况下(如果您没有以任何方式指定任何加载程序),回退
洛达斯装载机启动
{
plugins: [
new HtmlWebpackPlugin({
template: 'src/index.html'
})
]
}
请注意,使用.html
作为模板扩展可能会出现意外情况
触发另一个加载器
请首先按照文档进行操作,查看是否存在加载程序冲突。对于我来说,解决方案是确保所有内容都已更新
我在Webpack5上,除了
HTMLWebpackplugin
之外的所有东西都是最新的。我将html网页包插件
从v4升级到v5,问题就消失了。@Lhew:我的荣幸:)我收到了这个错误。我没有冲突。我没有为.html
文件设置任何加载程序。我想让您知道,您回答了一个一年前的问题,仅7小时后就解决了我的问题。:)天哪,还是一样,奇怪。这一定是因为最近网页包发生了重大变化,虽然我不记得升级了它…这真的很奇怪!!我无缘无故地面对这个问题,坚持我们的prod构建,最终可以通过升级最新版本来解决它!当升级到v5试图解决另一个问题时,我实际上遇到了这个错误。