配置文件中设置引入css文件

之前讲过在援用css文件的时刻能够引入style-loader和css=loader，诸如如许：

require("style-loader!css-loader!./src/css/style.css")

如今供应一种更经常运用和更便利的要领。

• 一样先在项目文件夹下装置style-loader和css=loader模块
  npm install style-loader css-loader --save-dev

• 配置文件webpack.config.js以下：
  

  module: { //module选项用来处置惩罚对应的模块
      rules: [
          {
              test: /\.css$/,  //用正则婚配一切的css文件
              use: ['style-loader','css-loader']   //运用style-loader,css-loader模块
          }
      ]
  }

• 如许就已能够一般打包css文件了。

## 援用其他js文件和css文件 ##

• 建立基础目次以下：
  
• 在a.js和b.js文件中编写测试代码，以下：
  
• 编写css文件测试代码，以下：
  
• 在main.js中援用a.js、b.js和style.css文件
  
• 末了，npm run dev最先打包文件
  
• index.html中引入main.js文件，在浏览器中翻开调试台
  <script src="dist/js/bundle.js" type="text/javascript" charset="utf-8"></script>