webpack4 下如何实现在页面没有引用css情况下自动将指定同名css文件link插入到同名html中
如题：
webpack项目目录：
src
js
sass
index.scss
about.scss
index.html
about.htmlmodule.exports = {
entry: {
index: './src/entry.js',
about: './src/js/about.js',
},
output: {
path: path.join(__dirname, "../dist/"),
filename: "js/[name].min.js?[hash]"
},
plugins: [
new HtmlWebpackPlugin({
filename: 'index.html',
template: "./src/index.html",
chunks: ["index"]
}),
new HtmlWebpackPlugin({
filename: 'about.html',
template: "./src/about.html",
chunks: ["about"]
}),
]
}
目前我使用以上配置实现了：同名js文件插入同名html，
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
这是关于
<script type="text/javascript" src="js/about.min.js?815ee51acf02c880d97f"></script></body>
</html>如何实现scss编译后的csslink入html中呢？
像下面这样：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="css/about.71bb02ebdae331e6bb2d.min.css" rel="stylesheet">
</head>
<body>
这是关于
<script type="text/javascript" src="js/about.min.js?815ee51acf02c880d97f"></script></body>
</html>如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
在页面里面 improt './sass/index.scss'
在页面的js文件里将对应的css导入
再使用 mini-css-extract-plugin 再css分离成文件
再html-webpack-plugin 配置inject 应该会将其注入到html里