您当前的位置： 首页 > 学无止境 > JS经典实例 网站首页JS经典实例

webpack生成到指定目录并自动挂载

发布时间：2020-04-04 12:06:18编辑：雪饮阅读（）

 

依赖

npm install html-webpack-plugin

webpack.dev.config.js

var path  = require('path');
 const HtmlWebpackPlugin  = require('html-webpack-plugin')
 module.exports = {
    //把以前用的main.js转移到新建的src目录下了，后面出现src的同理
    entry:{
       "main":'./src/main.js'
    },
    output:{

//指定的生成目录
       path:path.resolve('./dist'),//相对转绝对
       filename:'build.js'
    },
    watch:true,
    module:{
       loaders:[
          {
             test:/\.css$/,
             loader:'style-loader!css-loader'
          },
          {
             test:/\.(jpg|png|jpeg|gif|svg)$/,
             loader:'url-loader?limit = 60000'
          },
          {
             test:/\.less$/,
             loader:'style-loader!css-loader!less-loader'
          }
 
       ]
    },
    plugins:[
       // 插件的的执行顺序与元素由关、HtmlWebpackPlugin插件可以实现在生成build.js后自动用index.html然后去自动挂载build.js
       new HtmlWebpackPlugin({
          template:'./src/index.html',//参照物（所用的index.html，该文件不存在就会新建）
       })
 
 
    ]
 }