使用webpack和react搭建项目

看了N多博客，日志，一边迷茫一边摸索。本文记录流程。我怕自己忘了。。。并且修复了博客园首页推荐那个日志中遇到的bug

1、webstorm新建一个空白项目，比如webpack_demo

2、因为要用react和es6语法，调整webstorm-设置-语言-javascript-jsx，确定。这样文件不会报错。

使用webpack和react搭建项目

3、新建app（存放入口文件，component组件），static（存放打包后的文件），webpack（存放webpack配置文件）三个文件夹

4、在webpack_demo根目录，打开cmd或者终端，输入npm init，一路回车

5、完成后，继续输入npm install webpack -g。完成webpack的配置

6、在app中新建main.js；在webpack中新建配置文件webpack.config.js；在static中新建一个index.html；在static中新建一个js目录

7、在index页面写以下内容

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>webpack_Demo</title>
</head>
<body>
<div class="content">
</div>
<script src="./js/app.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>

View Code