配置webpack3.6.0处理css、less、es6、图片文件、vue

首先配置webpack的基本配置，包括entry( 入口)、output（出口）：

  创建webpack.config.js文件放置所有的webpack的配置，

接下来是配置命令：

  module.exports={

entry:"",

output:{

    path:"",(写绝对路径，打包后的输出文件，一般通过node的path以及path.resolve的拼接函数，进行动态获取)

    filename:""

}

}

然后提到的是如何将npm run XXX命令与webpack命令形成映射？

在package.json文件中的script下对应添加

"scripts":{

    “build”:"webpack",

}

类似的代码就行了

下面是webpack如何对css文件进行处理？

（webpack的扩展处理都是通过安装对应的loader进行的）

处理css需要的loader为：css-loader、style-loader

处理css需要的webpack配置为：

在module下添加相应的rules

 module: {
    rules: [
      {
        test: /\.css$/,
        use: [ ‘style-loader‘, ‘css-loader‘ ]
      }
    ]
  }

配置webpack3.6.0处理css、less、es6、图片文件、vue

原文：https://www.cnblogs.com/carry-2017/p/11298739.html