React 【ES2015】+ Babel + Gulp + Webpack

前端之家收集整理的这篇文章主要介绍了React 【ES2015】+ Babel + Gulp + Webpack前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

React 【ES2015】+ Babel + Gulp + Webpack

varwebpack=require("webpack");
varcommonsPlugin=newwebpack.optimize.CommonsChunkPlugin("common.js");

module.exports={
	entry:{//入口文件
		routes:"./src/routes.js"
	},output:{//打包输出
		path:__dirname,filename:"[name].entry.js"
	},resolve:{//定义模块路径
		extensions:['','.js','jsx']
	},externals:{
'React':'window.React'
},module:{//处理模块
		loaders:[{
			test:/\.js$/,loader:'babel-loader',query:{
				presets:['es2015','react']
			}
		},{
			test:/\.jsx$/,'react']
			}
		}]
	},plugins:[commonsPlugin]
};

package.json

{
"name":"cnode.js","version":"1.0.0","description":"","main":"index.js","scripts":{
"test":"echo\"Error:notestspecified\"&&exit1"
},"author":"jso0","license":"ISC","dependencies":{
"babel-core":"^6.5.2","babel-loader":"^6.2.2","bootstrap":"^3.3.6","gulp":"^3.9.1","gulp-webpack":"^1.5.0","localStorage":"^1.0.3","react":"^0.14.7","react-bootstrap":"^0.28.3","react-dom":"^0.14.7","react-router":"^2.0.0","webpack":"^1.12.13"
},"devDependencies":{
"babel-preset-es2015":"^6.5.0","babel-preset-react":"^6.5.0"
}
}

参考:

babel 为什么没能识别我 js 文件中的 jsx 语法?

猜你在找的React相关文章