Webpack入门教程五

27.json-loader模块使用,安装json-loader模块

cnpm install --save-dev json-loader

28.在根目录创建config.json文件,文件内容如下

{
	"greetText":"this is json config"
}

29.修改webpack.config.js文件,添加json-loader模块支持,内容如下

module.exports = {
	entry:  __dirname + "/app/Greeter.js",
	output: {
		path: __dirname + "/public",
		filename: "bundle.js"
	},
	devServer:{
		contentBase:"./public",
		historyApiFallback:true,
		inline:true
	},
	module:{
		loaders:[{
			test:/\.json$/,
			loader:"json-loader"
		}]
	}
}

30.修改main.js文件,修改内容如下

var config = require("../config.json");

module.exports = function() {
  var greet = document.createElement('div');
  greet.textContent = config.greetText;
  return greet;
};

31.使用webpack打包

webpack

32.查看生成的bundle.js文件

转载于:https://blog.51cto.com/suyanzhu/1899054