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, чтобы просмотреть его в браузере.

Страница перезагрузится, если вы внесете изменения.

Вы также увидите любые ошибки в консоли.

npm run build

Собирает приложение для производства в папке build .

Он правильно объединяется в производственном режиме и оптимизирует сборку для достижения наилучшей производительности.

Сборка минимизирована, а имена файлов включают хеши.

Ваше приложение готово к развертыванию!

Дополнительные сведения см. в разделе о развертывании.

npm run release

Объединяет версию package.json со стандартной версией.

npm run deploy

Развертывает приложение на страницах GitHub, принудительно помещая папку build в ветку gh-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

Тестирование

Тесты запускаются так же, как Create 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

См. сообщение в блоге или миграцию веб-скриптов.

Лицензия

Массачусетский технологический институт