Arkindex Frontend

Dev Setup

1. Install Node.js 12 or later and NPM
2. Clone the repository
3. npm install

Common operations

• npm run build: Build for development, no Docker image

• npm start: Start a local development server on localhost:8080

• npm run production: Build for production, no Docker image

• npm run lint: Perform ESLint checks

• npm run test: Run unit tests

• npm run start-test: Run unit tests, then watch for edits and re-run with each change

• make build: Build to a local Docker image using latest GitLab CI artifact

• make latest: Build Docker image, tag as latest and push to GitLab

• make release: Build Docker image for a version number and push to GitLab

• make clean: Clean build stuff

• make all: Clean and build

Linting rules

See the .eslintrc.yml file for the exact ESLint settings. The linting rules are based on the following sets:

• StandardJS
• ESLint Recommended
• Vue.js Essential + Strongly Recommended
• eslint-plugin-import

Some rules have been customized:

• Using == and != in templates will show warnings — use === and !== instead (vue/eqeqeq);
• Using this in a template causes errors — use text instead of this.text (vue/this-in-template);
• Single-line HTML elements are allowed to hold content (<h1>hello</h1> is allowed);
• To bind JavaScript expressions to attributes, use :property="", not v-bind:property="", but to bind JavaScript expressions to events, use v-on:event="", not @event="" (vue/v-bind-style, vue/v-on-style)
• Single-line HTML elements can have up to three attributes ; you have to switch to multiline elements with one attribute per line above that (vue/max-attributes-per-line)
• Void elements (HTML elements which do not hold content, like br) should be self-closing — <br /> instead of <br> (vue/html-self-closing)
• HTML elements that can hold content like p should never be self-closing — <p></p> instead of <p /> (vue/html-self-closing)