[问题记录] webpack devServer HtmlWebpackPlugin 没有加载 js、css
webpack devServer 没有加载 js、css
HtmlWebpackPlugin runtimeChunks 注入问题。
描述
写了一个极其简单的多页面 demo
启动开发服务器,发现样式没了,打开控制台,发现 js 也没有执行。
但是 build 一切正常。
webpack 配置如下:
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
module.exports = {
entry: {
index: './src/index.js',
myecharts: './src/echarts/myecharts.js',
},
plugins: [
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
hash: true,
filename: 'index.html',
template: './src/index.html',
chunks: ['index']
}),
new HtmlWebpackPlugin({
hash: true,
filename: 'html/myecharts.html',
template: './src/echarts/myecharts.html',
chunks: ['myecharts']
}),
],
module: {
rules: [
{
test: /\.css$/,
use: [
'style-loader',
'css-loader'
]
}
]
},
optimization: {
splitChunks: {
cacheGroups: {
commons: {
name: 'commons',
chunks: 'initial'
}
}
}
},
output: {
filename: 'js/[name].js',
path: path.resolve(__dirname, 'dist')
},
};
解决方法
把 HtmlWebpackPlugin 升级到 4.0.0-alpha.2
参考:
https://segmentfault.com/q/1010000018424725
https://github.com/jantimon/html-webpack-plugin/issues/1053
[问题记录] webpack devServer HtmlWebpackPlugin 没有加载 js、css的更多相关文章
- php cli模式没有加载php.ini
这两天在虚拟机的linux里编译安装了php,同时也把swoole的扩展也编译上了.在/etc/php.ini里加上了extension=swoole.so,但是用php -m 查看加载的模块并没有s ...
- vue-router动态路由 刷新页面 静态资源没有加载的原因
在做项目的时候,发现刷新页面的时候,静态路由没有加载,度娘了一圈,终于解决了. vue-router使用history模式+使用嵌套路由: 访问路由和嵌套路由页面,显示正常,但是刷新页面的时候,嵌套路 ...
- IE浏览器没有加载CSS或js文件的秘密及解决办法
其实是两处资料拼成这一篇博文的,因为在开发过程中遇到,有的文章只是说明原因,而没有给出解决方案,所以再次给出解释和解决方法,以供参考,如果有好的解决方法,也请分享下! ---------------- ...
- 动态加载js css 插件
简介 动态加载js,css在现在以及将来肯定是很重要的.目前来看前端代码编写的业务量已经远远超过后端编写的.随着对用户体验度逐渐增强,前端业务复杂,加载速度变得很慢很慢.为了解决这个问题,目前出现的两 ...
- js动态加载js css文件,可以配置文件后辍,防止浏览器缓存
js的引用,在浏览器,或微信上访问经常会遇到文件改了,但就是没有更新的问题,使用此函数可以轻松解决缓存问题只需要把js的引用方式改为使用此函数加载即可 源码如下: /** * js动态加载js css ...
- 页面加载异常 清除浏览器静态文件 js css 缓存 js动态加载js css文件,可以配置文件后辍,防止浏览器缓存
js清除浏览器缓存的几种方法 - 兔老霸夏 - 博客园 https://www.cnblogs.com/Mr-Rocker/p/6031096.html js清除浏览器缓存的几种方法 一.CSS和 ...
- javascript异步延时加载及判断是否已加载js/css文件
<html> <head> <script type="text/javascript"> /**======================= ...
- [Yii2] 快速套模板,加载JS,CSS(HTML标签<base>)
刚开始学,弄了好久,不知道怎么加载JS.CSS,以及怎么不加载YII2自带的模板!其实真的好简单! 补: 其实是我垃圾,YII2默认访问路径是WEB,所以把style文件放到web下就能加载! 首先把 ...
- Django与Vue交互,实现注册的图片验证码没有加载的原因
注册功能之图片验证码: 1.实现过程: 传递uuid给后端,再发送图片验证码的请求给后端,后端存储uuid并生成图片验证码保存到redis,然后将图片验证码返回给前端. 当用户输入图片验证码的时候,前 ...
随机推荐
- bzoj3381[Usaco2004 Open]Cave Cows 2 洞穴里的牛之二*
bzoj3381[Usaco2004 Open]Cave Cows 2 洞穴里的牛之二 题意: RMQ问题.序列长度≤25000,问题数≤25000. 题解: 倍增. 代码: #include < ...
- 手把手教你安装Office 2019 for Mac ,安装包和破解码都给你准备好了,还装不上的话,你找我!
准备一个安装包,和一个破解工具 安装MicrosoftOffice16.23.19030902_Installer.pkg, 注意在断网情况下安装 同时不要自动更新 , 安装好之后不要打开文件! ...
- 坚果云如何使用二次验证码/谷歌身份验证器/两步验证/虚拟MFA?
一般步骤:登陆后点邮箱名——安全设置——开通两步验证,用二次验证码微信小程序绑定即可 具体步骤见链接 坚果云如何使用二次验证码/谷歌身份验证器/两步验证/虚拟MFA? 二次验证码小程序于谷歌身份验证 ...
- windows如何解决Error: Registry key 'Software\JavaSoft\Java Runtime Environment'\CurrentVersion'
问题再现与解读 首次,使用 java 命令+任意参数 都会报这个错误,最典型的就是java -version 解读一下这个报错信息,注册表路径 Software\JavaSoft\Java Runti ...
- Squeeze-and-Excitation Networks(SENet)详解
一.SENet简介 Squeeze-and-Excitation Networks(SENet)是由自动驾驶公司Momenta在2017年公布的一种全新的图像识别结构,它通过对特征通道间的相关性进行建 ...
- c++ string 类型 大小写转换
还是用以前的库函数就行的,toupper(int c)小写变大写和tolower(int c)大写变小写 可以直接这么干 string s = "ABCDEFG"; for( in ...
- 企业权限管理(SSM整合)(总结)
学于黑马程序员和传智播客联合做的教学项目 感谢 黑马程序员官网 传智播客官网 个人根据教程的每天的工作进度的代码和资料 密码:cti5 b站在线视频 微信搜索"艺术行者",关注并回 ...
- MacOS英语学习
总结于B站Mac云课堂:https://www.bilibili.com/video/BV1vf4y1U7SZ 各个软件的链接: Edge:https://www.microsoft.com/zh-c ...
- flask的第一次尝试
from flask import Flask app = Flask(__name__) @app.route('/') def hello_world(): return "Hello ...
- Python三角函数
Python三角函数: 函数: ''' math.sin(x) 返回的x弧度的正弦值. math.asin(x) 返回x的反正弦弧度值. math.cos(x) 返回x的弧度的余弦值. math.ac ...