從零開始搭建Webpack+react框架

1.下載node.js

Node.js官網下載 , 安裝；

安裝成功後在控制檯輸入node -v 可查看當前版本：

$ node -v
v10.15.0

輸入npm -v查看npm版本：

$ npm -v
6.4.1

 2.建立項目

　1.安裝各類須要的依賴: 

• npm install --save react - 安裝React.
• npm install --save react-dom 安裝React Dom,這個包是用來處理virtual DOM。這裏提一下用React Native的話，這裏就是安裝react-native。
• npm install --save-dev webpack - 安裝Webpack, 模塊打包工具.
• npm install --save-dev webpack-dev-server - webpack官網出的一個小型express服務器，主要特性是支持熱加載.
• npm install --save-dev babel-core - 安裝Babel, 能夠把ES6轉換爲ES5，注意Babel最新的V6版本分爲babel-cli和babel-core兩個模塊，這裏只須要用babel-core便可。
• npm install --save babel-polyfill - Babel includes a polyfill that includes a custom regenerator runtime and core.js. This will emulate a full ES6 environment
• npm install --save-dev babel-loader - webpack中須要用到的loader.
• npm install --save babel-runtime - Babel transform runtime 插件的依賴.
• npm install --save-dev babel-plugin-transform-runtime - Externalise references to helpers and builtins, automatically polyfilling your code without polluting globals.
• npm install --save-dev babel-preset-es2015 - Babel preset for all es2015 plugins.
• npm install --save-dev babel-preset-react - 用於將 JSX 和其餘東西編譯到 JavaScript
• npm install --save-dev babel-preset-stage-2 - All you need to use stage 2 (and greater) plugins (experimental javascript).

　2.打開 package.json 而後添加下面的scripts:

"scripts": {
  "start": "webpack-dev-server --hot --inline --colors --content-base ./build",
  "build": "webpack --progress --colors"
}

　爲項目建立一個目錄： mkdir webpack-react-tutorial && cd webpack-react-tutorial

　建立一個用於保存代碼的最小目錄結構：mkdir -p src

　經過運行來啓用項目：npm init -y

   到此項目創建完成！

懶得碼字 本段來源做者：瘦人假嚕嚕
連接：https://www.jianshu.com/p/324fd1c124ad