小编Mat*_*nov的帖子

Webpack watch()有多个入口点 - 为未更改的文件发送捆绑包?

在我的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注入.

javascript node.js webpack browser-sync

28
推荐指数
1
解决办法
1125
查看次数

Webpack - 不要为某个入口点输出一个包

我使用文件加载器自动渲染一堆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加载器,我可以放在加载器链的末尾来杀死束发射?

javascript node.js webpack pug-loader

8
推荐指数
1
解决办法
651
查看次数

Webpack - 将散列包URL插入静态pug模板

我使用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包文件

javascript hash node.js webpack pug-loader

7
推荐指数
0
解决办法
618
查看次数

Webpack简单地将一堆Pug模板编译为HTML

我开始使用webpack,但有一件事我无法解决的问题是如何获取一个文件夹(带有可能的嵌套文件夹),完整的.pug模板,只需将它们编译为静态html并将它们放在输出文件夹中,为源模板文件夹中的每个输出html文件维护任何嵌套文件夹结构...

我不想手动指定每个单独的.pug文件,我绝对不希望webpack尝试将.pugs解析为JS然后尝试在pug文件中要求/导入任何imgs/fonts等然后抱怨关于它,我只是在一个基本的,静态的1:1编译,pug文件,html文件中.为什么这么难?

javascript webpack pug

5
推荐指数
1
解决办法
5277
查看次数

浏览器同步和代客安全

我使用浏览器同步来提供我的本地开发网站。我也在使用 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 中工作正常,并在地址栏上显示“安全”

ssl https node.js browser-sync laravel-valet

4
推荐指数
1
解决办法
1505
查看次数