Calchart

Calchart 4.0 for the web!

See this Figma link for the design. Also see calchart-redesign-old for the prototype.

Project bootstrapped from Vue CLI.

On-boarding

See this onboarding page for getting started on development.

Project setup

npm ci

Please use npm ci instead of npm install to avoid package-lock.json being changed at random. For example see npm/cli#1360.

Please use the LTS version of NodeJS/npm for this project.

We recommend using Visual Studio Code as your IDE. This integrates well with Typescript. We recommend installing the following extensions: ESLint, Vetur, Debugger for Chrome, Debugger for Firefox.

To set up debugging in vscode, please see Vue CLI docs.

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your unit tests

# Run all tests
npm run test:unit
# Run specific tests that match regex "Grapher"
npm run test:unit Grapher
# Watch all tests
npm run test:unit -- --watchAll

We are using Jest for the unit test framework.

Vue CLI docs.

Debug your unit tests

# macOS or linux
node --inspect-brk ./node_modules/.bin/vue-cli-service test:unit
# Windows
node --inspect-brk ./node_modules/@vue/cli-service/bin/vue-cli-service.js test:unit

See this for instructions on how to attach Google Chrome or VSCode to the tests.

Vue CLI docs

Run your end-to-end tests

# Run normally (opens Chrome)
npm run test:e2e
# Run in headless mode (generates videos)
npm run test:e2e -- --headless

We are using Cypress for the end to end test framework.

Vue CLI docs

Lints and fixes files

npm run lint

Vue CLI docs

Integrate ESLint with your text editor! See this.

Update dependencies

To update the dependencies in package.json and package-lock.json, first try updating the Vue CLI plugins, then any other package.

Update Vue CLI Plugins

npm install -g @vue/cli # Install globally if not already
vue upgrade

Identify and update other packages

npm outdated # Lists available package versions
npm update # Updates packages within the specified range in package.json

To update a package at a specified version:

npm install package@version