问题标签 [html-webpack-plugin]

用于问题测试的简约存储库

我现在有最简单的项目结构：

套餐：

在 app.js 中，我只需要样式并使用 app.js 作为 webpack.config.js 中的条目，如下所示：

运行 webpack-dev-server：webpack-dev-server --hot --inline

之后，我得到了很好的 css 热替换，但不是 html。当我更改我的 index.pug 模板文件时，我收到一些控制台消息取决于 app.js 中是否需要 pug-template。

文件app.js（webpack 入口点）

用纯 html 代替 pug 是一样的。怎么可能修好？

我正在使用 webpack2 并将 hot loader3 与 express 反应。我收到一个错误

Uncaught SyntaxError: Unexpected token < in dist/index.html

这是我的配置文件

webpack.config.js

服务器.js

包.json

这是控制台中显示的错误的屏幕截图

此错误的原因可能是什么？htmlWebpackPlugin 或 extract-text-webpack-plugin 有问题吗？

使用 publicPath 和 manifest.hash.js更新 我的 dist 的 index.html 将是

我正在使用 angular2-webpack-starter 5.4.1。 https://github.com/AngularClass/angular2-webpack-starter

要为生产构建自定义 baseUrl，在 config/webpack.prod.js 中，我只是重复在 config/webpack.common.js 中所做的。

接着：

这行得通，但闻起来很臭。理想情况下，我只需要更改 config/webpack.prod.js 中的 METADATA.baseUrl 变量。

有没有人找到更好的方法？

Hello Angular 2 and Webpack developers, I have been working with angular 2 and systemjs since quite a while, new to webpack (starting to love it with a bit of struggle).

I have a component that has html as follows:

Its basically a slider. I have a library that I use in a lot of projects, for animations and stuffs.

Theres a function as follows that initiates a slider:

function call:

Problem here is $partnersSlider.length is always 0.

As per my understanding, the html element is placed inside a minified file by webpack (prod)

main.bundle.js

I am referring my external javascript file inside index.html as a script tag. It doesnt seem to recognise the dom element with id="properties-slider" as the element is inside main.bundle.js?. I am able to debug and see it in my library code.

Has anyone done that before? Thanks for any help!

我正在使用带有 webpack 的谷歌地图 api，要生成谷歌地图，它应该在加载 API js 文件之前加载捆绑文件。但是 HtmlWebpackPlugin 将捆绑文件放在 body 元素的底部。如何在捆绑文件之前加载捆绑包？这是我的webpack.config.js下面。

控制台截图

我想强制 webpack 为某些文件/文件夹启用特定的插件或加载器，增加文件。有办法吗？

当我在 webpack 配置中同时使用HtmlWebpackPlugin和CommonsChunkPlugin时，我收到一条错误消息Uncaught TypeError: Cannot read property 'call' of undefined。

有人说非但minChunks不可。但我只想使用回调将所有第三方库从.callbackInfinitynode_modules

我知道这个问题有类似的问题，但没有一个对我有帮助。

这是我的webpack.config.js

提前非常感谢。

这是我在下面使用的版本。

• 节点 v6.9.5

• webpack v2.2.1

目前，我已经编写了一个 webpack 任务来编译 vue 文件。

在生产模式下，我使用 UglifyJsPlugin 来缩小和压缩 index.js，它可以很好地工作很长时间。

但是我发现在生产模式下，scss 中的样式

被转化为

这将导致我的页面上出现黑线。

我尝试删除 postcss，但它不起作用。最后我发现如果我删除 UglifyJsPlugin 效果很好，但是文件太大，我必须使用在线压缩服务来缩小它。

这是webpack任务的一部分

而 postcss.config.js 是

有什么方法可以防止uglyfyJs 改变计算吗？

我在我的服务器上的 nginx 后面运行 Jenkins。我有一个用 NodeJS 构建的应用程序，它使用html-webpack-plugin。我已经设置了 favicon，它在本地显示正确的图像，但在服务器上它不会更新 Jenkins 徽标 favicon。这是我的设置方式：

我需要摆脱 Jenkins 徽标图标，但在 Jenkins 仪表板中找不到与此相关的任何内容。有人有任何提示吗？

谢谢

我一直在做一个 Vue 项目，并且已经完成了所有设置，因此到目前为止它运行良好。我已经WebPack (2)配置了入口点Polyfills和App, 和Vendor作为一个常见的块输出。

通常Webpack/以正确的顺序HtmlWebpackPlugin放置标签 ( , , )。<script>PolyfillsVendorApp

但是，当我import Rx from 'rxjs/Rx'进入我的App入口点时，它会<script>以错误的顺序（Vendor, App, Polyfills）重新排列标签。

我不知道为什么会发生这种情况，我认为其中有一些东西RxJs/Webpack认为HtmlWebpackPlugin在之前引入更重要Polyfills（我认为这就是它知道首先引入的Polyfills方式）。

我应该RxJs在我的polyfills? 我知道我可以强制HtmlWebpackPlugin按某种顺序输出，但RxJs似乎是唯一一种强制它按不同顺序输出的东西。

谢谢！