webpack的构建（非js文件的打包）

在上篇文章中我们介绍了js的打包以及一些模版的使用

现在来介绍怎么打包非js文件

• 为什么要专门介绍怎么去打包非js文件,这与js文件有什么不同
  因为webpack默认只能打包处理js文件无法处理非js类型的文件

• 如果要处理非js的文件，我们需要手动安装第三方loader加载器
  // 1 如果想要打包处理css 需要安装 npm i style-loader css-loader -D
  // 2 打开 webpack.config.js 这个配置文件，在里面，新增一个配置节点， 叫做 module,他是一个对象 在这个module 对象身上 有一个ruler属性是个数组 这个数组中存放了所有第三方文件的匹配的处理规则

下面我们跟着步骤来

• 首先创建一个css文件
  

• 再在我们的main.js中引入我们创建的index.css
  

• 运行我们的webpack
  
  我们发现会报错 ，说我们需要一个合适的loader来加载我们的css文件

• 那么我们就进行上面步骤介绍的第一个步骤了(安装 npm i style-loader css-loader -D)

我们在终端中输入如下代码进行安装

$ npm i style-loader css-loader -D

• 安装完成后我们进行第二个步骤(打开 webpack.config.js 配置文件进行相关配置)
  找到我们的webpack.config.js 在module.exports里面加入如下代码

module.exports = {
   
    entry: