在我的webpack.config.jsI中有3个单独的入口点,一个用于JS包,一个用于主SCSS包,另一个用于与主SCSS包无关的单独 SCSS包.
当我使用webpack.watch()API时,出于某种原因编辑JS源文件,不仅会导致重新编译JS包,还会导致2个SCSS包.
为什么会这样,以及如何停止此行为并确保仅重新编译已编辑的入口点?
这是一个问题的原因是我正在使用browsersync,对于CSS bundle重新编译我只是注入CSS而不是重新加载,但是在HTML/JS上编辑它的重新加载.但是,如果我编辑SCSS并且它还重新编译JS/HTML browsersync触发器重新加载而不是CSS注入.
我使用文件加载器自动渲染一堆pug模板到静态html文件,但webpack也输出一个基于入口点的无意义文件
例如,这是在我的webpack.config.js中:
entry: {
'js/build/bundle.js': './js/app.js',
'this-shouldnt-emit': './pug/.pug.js' //pug entry point
},
output: {
path: path.join(__dirname, '../'),
filename: '[name]'
},
...
// pug loading module rule
{
test: /\.pug$/,
include: path.resolve(__dirname, "../pug"),
use: [
"file-loader?name=[path][name].html&context=./pug",
"pug-html-loader?pretty&exports=false"
]
}
Run Code Online (Sandbox Code Playgroud)
我this-shouldnt-emit在根构建目录中得到一个捆绑文件,我不想要.
如何阻止文件加载器发出输出包,但不干扰它生成当前所有的静态html文件.是否有一个插件或某种类型的null加载器,我可以放在加载器链的末尾来杀死束发射?
我使用webpack pug-html-loader + file-loader来生成一堆静态pug模板.
我也想开始添加散列包文件名,但我无法弄清楚如何将散列文件名插入到我所有的哈巴狗模板中
这是我在所有pug模板中当前引用我的包的方式:
script(src="bundle.js")
link(href="bundle.css")
Run Code Online (Sandbox Code Playgroud)
如何修改它来引用bundle-[chunkhash].js/ bundle-[chunkhash].css]- 我是否需要将一些变量传递给我的webpack.config.js中的pug-html-loader?
注意我使用extract-text-plugin将我的SASS输出到.css包文件
我开始使用webpack,但有一件事我无法解决的问题是如何获取一个文件夹(带有可能的嵌套文件夹),完整的.pug模板,只需将它们编译为静态html并将它们放在输出文件夹中,为源模板文件夹中的每个输出html文件维护任何嵌套文件夹结构...
我不想手动指定每个单独的.pug文件,我绝对不希望webpack尝试将.pugs解析为JS然后尝试在pug文件中要求/导入任何imgs/fonts等然后抱怨关于它,我只是在一个基本的,静态的1:1编译,pug文件,html文件中.为什么这么难?
我使用浏览器同步来提供我的本地开发网站。我也在使用 Laravel Valet。当我通过valet securehttps 为开发网站提供服务时,我会收到那些丑陋的 Chrome 隐私错误页面。有办法阻止这种情况吗?
我的浏览器同步配置如下:
browserSync.init({
host: "https://mysite.dev",
proxy: "https://mysite.dev",
...
Run Code Online (Sandbox Code Playgroud)
mysite.dev随着站点的变化,我正在处理很多本地开发站点。
当我运行npm start浏览器同步输出时:
[BS] Proxying: https://mysite.dev
[BS] Access URLs:
------------------------------------------
Local: https://localhost:3000
External: https://https://mysite.dev:3000
------------------------------------------
UI: http://localhost:3001
UI External: http://https:3001
Run Code Online (Sandbox Code Playgroud)
正如您所看到的,它正确映射了 URL,如果我忽略 Chrome 隐私错误警告,我可以正常看到该网站。我只是想知道为什么 https 不能正常工作。
如果我https://mysite.dev 在没有浏览器同步:3000端口的情况下访问,它在 Chrome 中工作正常,并在地址栏上显示“安全”
javascript ×4
node.js ×4
webpack ×4
browser-sync ×2
pug-loader ×2
hash ×1
https ×1
pug ×1
ssl ×1