@povio/spa-deploy-cli
v4.2.0
Published
Use this tool to deploy and configure an SPA.
Downloads
266
Maintainers
Readme
SPA Deploy CLI
Use this tool to deploy and configure an SPA.
Features:
Static SPA deploy:
- Deploy to AWS S3
- Targeted CloudFront invalidation and caching
- Embed environment variables into HTML
Next.js Configuration:
- From SSM Parameter Store
Examples:
Setup
Running without installing. Make sure to lock the version, check the latest version on npm.
yarn dlx @povio/[email protected]
If using yarn cache, you can install the package:
yarn add @povio/spa-deploy-cli
Configure
accountId: "000000000000"
region: us-east-1
# Static SPA deploy config
deploy:
buildPath: "./dist"
#includeGlob: "**"
#ignoreGlob:
s3:
acl: "public-read"
bucket: myapp-dev-website
#prefix:
purge: false
force: false
# extra glob for invalidation
#invalidateGlob:
# ignore s3 changes for invalidation
#skipChangesInvalidation: false
cacheControl: "max-age=2628000, public"
# pattern match cache control, first match wins, default is cacheControl
#cacheControlGlob:
# - glob: "*.html"
# cacheControl: "no-cache, no-store, must-revalidate"
cloudfront:
distributionId: CF000000000000
invalidatePaths: "/*"
# Environment file config
configs:
# Write into env file (Next.js)
# destination: ./.env.local
# Write into yaml
# destination: ./production.yaml
# Write into .html, in the head section or <script id="env-data"></script>
# Warning: all values will be public
# destination: ./dist/index.html
values:
# load config from ./.config/${stage}.base.template.env
# and interpolate ${arn:aws:ssm..} and ${env:ENV_VALUE} values
# load them onto the root
- name: "@"
configFrom: base.template
# simple value mapping
- name: database__password
valueFrom: arn:aws:ssm:::parameter/myapp-dev/database/password
# JSON object mapping
- name: database
valueFrom: arn:aws:ssm:::parameter/myapp-dev/database
- name: database__host
valueFrom: env:DATABASE_HOST
Example
Where configFrom: base.template
and the config file is .config/${stage}.base.template.yml
:
APP_RELEASE: ${func:release}
APP_STAGE: ${func:stage}
APP_VERSION: ${env:APP_VERSION}
STATIC_URL: https://static.example.com
NEXT_PUBLIC_SENTRY_CDN: https://[email protected]/1
the output will be at the set destination, for example .env.local
:
APP_RELEASE=61be6e2c61be6e2c61be6e2c61be6e2c
APP_STAGE=myapp-stg
APP_VERSION=0.0.1
STATIC_URL: https://static.example.com
NEXT_PUBLIC_SENTRY_DSN=https://[email protected]/1
Injecting the environment
yarn spa-deploy bootstrap --stage myapp-stg
Pure SPA or after build time configuration
Using the destination: ./dist/index.html
option, you can inject the environment into the HTML file.
The file will be edited in place, with the following content inserted into
the <head>
section, replacing any existing <script id="env-data">
:
<script id="env-data">
// you can add local testing variables here,
// this will get overwritten at build
window.APP_STAGE = "myapp-stg";
</script>
Static SPA Deploy
yarn spa-deploy deploy --stage myapp-stg
Development
Test locally
# prerequisites
corepack install
yarn
# run tests
yarn test
# run sources with tsx
yarn start --help
yarn start bootstrap --pwd ./test --stage myapp-dev
# build new version
yarn build
# test build
yarn start:prod --help
yarn start:dist bootstrap --pwd ./test --stage myapp-dev
# test deploy
yarn start:dist deploy --pwd ./test --stage myapp-dev