详解用vue-cli来搭建vue项目和webpack

webpack entry.js bundle.js 

css的文件步骤很复杂，那么有更简单的办法不需要写的那么复杂

第十一步：建立一个配置js文件,webpack.config.js

//webpack.config.js 
var webpack = require('webpack')
module.exports = {
 entry: './entry.js',
 output: {
  path: __dirname,
  filename: 'bundle.js'
 },
 module: {
  loaders: [
   {
    test: /.css$/,
     loader: 'style-loader!css-loader'
    }
  ]
 }
}     

这个loaders:是一个解析器

test:就是需要解析模板的文件，是一个正则表达式

loader:是需要用什么方式去处理test所包含的文件,用xxx-loader去读取test的正则文件

第十二步：然后就可以把css文件打包的时候简单化了

require('./style.css') 

再重新编译一下就可以了

第十三步：不想要一直编译，想实时监控，

webpack --watch 

第十四步：也可以开一个静态web服务器，localhost,webpack-dev-server,全局安装

npm install webpack-dev-server -g 

第十五步：运行webpack-dev-server:会实时监控

webpack-dev-server