Vue.js + TypeScript (with decorators) + Parcel

Awesome Vue TypeScript Component usage (decorators) with parcel-bundler build

Development

npm i
npm start

Production Build

npm run build
# or: npm run serve

Run Unit Tests

npm t

Note that new components should be added to test_map.js in order to make them easily available to the unit tests.

Write and Run Integration Tests

Begin by running the parcel command to start serving the project locally on port 1234.

Then export an env var for the Cypress baseUrl

export CYPRESS_baseUrl=http://localhost:1234

or in PowerShell

$env:CYPRESS_baseUrl = "http://localhost:1234"

Then launch Cypress to run tests

./node_modules/.bin/cypress open

TSLint Setup

To run tslint manually (doesn't lint in .vue files yet)

npm run lint

GitHub Pages

See .travis.yml, but in short:

npm run gh-pages

Links and Resources

• GitHub: vuejs/vue-class-component - see that example as a reference
• Read Vue TypeScript article
• Parcel: interpolate %baseHref% variable into html