webpack打包出的js-如何引入到index.hml并输出

一、首先js注入到index.html

HtmlWebpackPlugin;该插件会创建一个html文件并将打包后的js文件以script标签引入;我们可以通过属性inject配置script标签的位置;可以通过template指定html模版

new HtmlWebpackPlugin({
      template:resolve(publicPath;;public/index.html;),//模版 指定index.html 的模版
      filename: ;index.html;,//配置输出的文件名
      inject:;body;,//将js文件注入到模版的什么位置
      minify: { // 对html压缩
        keepClosingSlash: true,//在单例元素上保留尾部斜杠
        // removeRedundantAttributes: true,//当值与默认值匹配时移除属性
        // removeScriptTypeAttributes: true,//删除脚本类型的属性
        removeStyleLinkTypeAttributes: true,
        useShortDoctype: true,
        collapseWhitespace: true, // 移除空格
        removeComments: true // 移除注释
      },
    })

2、webpack只能识别js和json文件 对于css文件 需要通过插件进行解析并注入

详情下文继续分享