web app template

网络应用程序模板

与框架无关的web app template 。这个项目类似于 Create React App，只是 React 被删除了。

查看网络应用程序。

先决条件

• Node.js

安装

克隆存储库：

git clone https://github.com/remarkablemark/web-app-template.git
cd web-app-template

重命名项目：

web app template /My App Template/g' git grep -l 'Web App' | xargs sed -i '' -e 's/Web App/My App/g'">

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。

执照

麻省理工学院