與框架無關的web app template 。這個專案類似 Create React App,只是 React 被刪除了。
查看網頁應用程式。
克隆儲存庫:
git clone https://github.com/remarkablemark/web-app-template.git
cd web-app-template
重新命名項目:
git grep -l web-app-template | xargs sed -i ' ' -e ' s/web-app-template/my-app/g '
git grep -l ' web app template ' | xargs sed -i ' ' -e ' s/ web app template /My App Template/g '
git grep -l ' Web App ' | xargs sed -i ' ' -e ' s/Web App/My App/g '
更新檔案:
README.md
package.json
public/index.html
public/manifest.json
src/index.js
安裝依賴項:
npm install
初始化一個新的儲存庫:
rm -rf .git
git init
進行第一次提交:
git add .
git commit -m ' feat: initialize project from web-app-template '
提交訊息遵循發布期間使用的常規提交格式。
準備就緒後,將本機儲存庫推送到 GitHub(或另一個遠端儲存庫):
git remote add origin < remote-repository-url >
git push origin -u origin master
在專案目錄中,您可以運行:
npm start
在開發模式下運行應用程式。
在瀏覽器中開啟http://localhost:3000即可查看。
如果您進行編輯,頁面將重新載入。
您還將在控制台中看到任何 lint 錯誤。
npm run build
將用於生產的應用程式建置到build
資料夾。
它在生產模式下正確捆綁並優化構建以獲得最佳性能。
建置被縮小,檔案名稱包含哈希值。
您的應用程式已準備好部署!
有關詳細信息,請參閱有關部署的部分。
npm run release
將package.json
版本與 standard-version 進行比較。
npm run deploy
透過將build
資料夾強制推送到遠端儲存庫的gh-pages
分支,將應用程式部署到 GitHub Pages。
環境變數的工作方式與 Create React App 類似,只是它們以WEB_APP_
而不是REACT_APP_
開頭。
例如:
# .env
WEB_APP_VERSION=$npm_package_version
WEB_APP_DOMAIN=www.example.com
WEB_APP_FOO=$DOMAIN/foo
測試的運行就像創建 React App 一樣:
npm test
您可以使用以下命令在本地建立生產應用程式:
npm run build
如果您的應用程式託管在子目錄中,請重新命名建置目錄:
mv build web-app-template
或者,如果您的應用程式託管在根目錄,則輸入建置目錄:
cd build
啟動靜態檔案伺服器:
python -m SimpleHTTPServer
使用Ctrl + C
停止伺服器。
在瀏覽器中開啟http://localhost:8000即可查看。
如果您的應用程式託管在子目錄中,請開啟目錄清單中的資料夾。
完成後,清理建置目錄。
如果您的應用程式託管在子目錄中:
rm -rf web-app-template
或者,如果您的應用程式託管在根目錄下:
rm -rf build
目錄結構(省略點文件):
tree -I ' build|node_modules '
.
├── LICENSE
├── README.md
├── package.json
├── public
│ ├── favicon.ico
│ ├── index.html
│ ├── logo192.png
│ ├── logo512.png
│ ├── manifest.json
│ └── robots.txt
└── src
├── index.css
├── index.js
├── reportWebVitals.js
└── setupTests.js
2 directories, 13 files
遷移到使用@descriptive/web-scripts:
npx web-scripts-migration
請參閱部落格文章或 web-scripts-migration。
麻省理工學院