代码之家 › 专栏 › 技术社区 › iphonic

使用网页包HtmlWebpackPlugin

html-webpack-plugin webpack reactjs javascript

iphonic · 技术社区 · 7 年前

我对网页和东西很陌生,我需要一个解决方案来分离 index.html 和 捆js公司 ,因为两者的开发和生产是不同的。

基本href =本地主机

=/束。js公司

用于生产

=服务器url

=/dist/bundle。js公司

为了解决上述问题,我正在尝试使用背景

var HtmlWebpackPlugin = require('html-webpack-plugin'); module.exports = { entry: [ './src/index.js' ], output: { path: __dirname + "/dist", publicPath: '/', filename: 'bundle.js' }, module: { rules: [ { exclude: /node_modules/, use:[ { loader: 'babel-loader', options:{ presets: ['react', 'es2015', 'stage-1'] } }, ] }, plugins: [ new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery" }), new HtmlWebpackPlugin({ template:'index.html', inject:'head', hash: true, baseHref: 'http://localhost:8030/' }) ] };

下面是我尝试使用的方式进入

<html> <head> <% if (htmlWebpackPlugin.options.baseHref) { %> <base href="<%= htmlWebpackPlugin.options.baseHref %>"> <% } %> /* Several css are defined with relative path here */ </head> <body> <div class="container-fluid"></div> </body> <script src="/bundle.js"></script> </html>

通过使用上述设置,我收到以下错误

我需要帮助才能知道我做错了什么?

谢谢

2 回复 | 直到 7 年前

Duncan Thacker 7 年前

https://github.com/jantimon/html-webpack-plugin/issues/212

Github上的这个问题建议将“index.html”文件重命名为“index.ejs”。

Predrag Davidovic 4 年前

主要目的 HtmlWebpackPlugin

如果你没有您应该记住在应用程序中使用的每个文件,并手动将其添加到 index.html .

推荐文章

Cobaia · 在npm网页中动态重命名img“src”

7 年前

Squiggs. · Web包HTML为每个入口点生成一个javascript

7 年前

Pic Mickael · HtmlWebpackPlugin不包括供应商。js公司

7 年前

Mojtaba · Linux中没有使用HtmlWebpackPlugin生成索引html文件

7 年前

iphonic · 使用网页包HtmlWebpackPlugin

7 年前

thelearner · 表示static()不工作

7 年前

Turner Hayes · 在Heroku上出现网页包错误“Chunk.entry已删除。使用hasRuntime()”

7 年前

Joshua Carlo · HTML网页包插件未解析EJS变量

8 年前

Turner Hayes · WebPackageHtmlPlugin输出生成了带有前缀的引用

8 年前