一.安裝node.js
官方下載地址https://nodejs.org/en/
盡量安裝最新的穩定版,react對node.js有版本要求
Node.js? is a JavaScript runtime built on Chrome's V8 JavaScript engine.
JavaScript一般都是在瀏覽器中執行的,而node.js就是提供了一個可獨立執行JavaScript的環境,這樣我們就有了一個可以獨立部署的前端工程。
通過以下命令檢查是否安裝成功
node -v
npm -v
二.npm包管理工具 基本使用
NPM是隨同NodeJS一起安裝的包管理工具,能解決NodeJS代碼部署上的很多問題,常見的使用場景有以下幾種:
1.允許用戶從NPM服務器下載別人編寫的第三方包到本地使用。
2.允許用戶從NPM服務器下載并安裝別人編寫的命令行程序到本地使用。
3.允許用戶將自己編寫的包或命令行程序上傳到NPM服務器供別人使用。
本地安裝
npm install 包名@版本號
uninstall同理
- 將安裝包放在 ./node_modules 下(運行 npm 命令時所在的目錄
),如果沒有 node_modules 目錄,會在當前執行 npm 命令的目錄
下生成 node_modules 目錄。
全局安裝
npm install -g 包名@版本號
uninstall同理
- 將安裝包放在 /usr/local 下或者你 node 的安裝目錄。
- 可以直接在命令行里使用。
其他常見命令:
npm list -g 查看安裝的包列表
npm list grunt
三.創建并運行react項目
npm install -g create-react-app 安裝官方提供的生成react項目demo工具
create-react-app hello-react 在當前目錄下創建名為hello-react的項目
如果安裝包太慢,可以改為國內的淘寶源
npm config set registry https://registry.npm.taobao.org
cd hello-react 進入項目目錄
npm start 運行
四.項目目錄結構介紹
yarn.lock 安裝包版本號
package.json 運行npm start 命令就是運行該文件里的內容
node_modules 外部包文件
public/index.html 頁面上顯示的html的內容
public/manfest.json PWA 如果是作為一個app,定義app的圖標,主體
src /index.js 項目的執行入口