html-webpack-plugin不会将css和元标记插入生成文件

我使用webpack运行我的vue应用程序，它使用webpack-simple模板。我的WebPack设置为：html-webpack-plugin不会将css和元标记插入生成文件

entry: './src/main.js', 
    output: { 
     path: path.resolve(__dirname, './dist'), 
     publicPath: '/dist/', // 由于将index.html打包至dist下，生产环境设为'/' 
     filename: 'build.js' 
    }, 
    plugins: [new HtmlWebpackPlugin()]

originHtml：

<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> 
    <link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_9remcre60b3dte29.css"> 
    <title>earease</title> 
    </head> 
    <body> 
    <div id="app"></div> 
    <script src="/dist/build.js"></script> 
    </body> 
</html>

generateHtml：

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="UTF-8"> 
    <title>earEase</title> 
    </head> 
    <body> 
    <script type="text/javascript" src="/dist/build.js"></script></body> 
</html>

为什么CSS和meta标签不注入到生成的HTML文件？

来源

2017-04-27 Jerry

你的webpack不抓取原始的html模板。它只是生成一个新的，你可以看到你的输出html上的<title>标签。

更改您的配置使HTMLWebpackPlugin可以读取模板文件：

{ 
    ... 
    plugins: [ 
    new HtmlWebpackPlugin({ 
     title: 'My App', 
     filename: 'assets/admin.html' 
    }) 
    ] 
}

来源

2017-04-27 01:49:22

我设置是这样的：插件：[ 新HtmlWebpackPlugin（{ 文件名： 'DIST/index.html的'，模板：'index.html' }） ]，但它仍然不能工作 – Jerry

@ user6542007 index.html文件是否与webpack配置位于同一目录中，并且是要传送到dist /文件夹的html文件？你能告诉我它的内容吗？ –

@ user6542007您是否正确指定了html加载器？ https://github.com/jantimon/html-webpack-plugin/blob/master/docs/template-option.md –

html-webpack-plugin不会将css和元标记插入生成文件

回答

相关问题