webpack的安装和基本使用

webpack安装基于nodejs，先安装nodejs。

第一步安装webpack

在相应的路径打开cmd，输入npm install webpack -g

npm install webpack-dev-server -g

npm install webpack -D

npm install webpack-dev-server -D

这里安装webpack和webpack服务器，并且安装全局和当前的路径（这样的好处是当你需要转移文件的时候可以带着当前的package.json一起）

建立一个js取名，我这里是webpack.build.js

module.exports = {
//	这个是输入路径,相对路径
	entry:'./src/main.js',
//	输出路径,绝对路径
	output:{
//		__dirname是当前路径前的绝对路径的那一部分
//		例如我的是C:\wamp\www\nodeItem\demo0719\my_pro
		path:__dirname+'/dist',
//		输出文件
		filename:'bundle.js'
	},
//	配置使用的模块
	module:{
//		配置使用的加载器
		loaders:[
//			需要处理的文件类型，正则跟文件路径匹配,这里有俩个,第一个是处理css,第二个是处理普通文件的loader
			{test:/\.css$/,loader: 'style-loader!css-loader'},
			{test: /\.(png|jpg|jpeg|gif|ttf|svg)$/,loader: 'url-loader'}
		]
	}
}

webpack-dev-server与webpack的代码区别只在于output下的path:__dirname,filename:'dist/bundle.js'

这个是loader的简单使用.

然后是plugins的使用

其实也就是在
        loaders:[
            {
                test: /\.js$/,
                exclude: /node_modules/,//除去node_modules文件路径下的js，不需要编译的
                loader: 'babel-loader'
            }
        ]

数组对象内加个test，把其导入。