wemake-vue-template
  • Introduction
  • Architecture
  • FAQ
  • Development
  • Configuration
  • Editors
  • TypeScript
  • Vue
  • Styles
  • Linting
  • Testing
  • Docker
  • GitLab CI
  • QA
  • Production
Powered by GitBook
On this page
  • JavaScript and TypeScript
  • Configuring eslint
  • jsdoc
  • Vue
  • Styles
  • Configuring stylelint
  • a11y
  • Markdown
  • Configuring remark
  • package.json
  • Afterwords

Linting

PreviousStylesNextTesting

Last updated 4 years ago

We lint everything, including: javascript, typescript, vue, css, and scss. We love linting to be as strict as possible.

Everything works for raw files and single file components out of the box. Everything is already configured, so you don't have to.

Use npm run lint to run everything we have.

JavaScript and TypeScript

We use eslint to lint javascript and typescript. We stick to code style. It is just like standard config, but stricter. But, we have some additional checks that make our style even more stricter.

To run js linting execute: npm run lint:js.

Configuring eslint

All configuration can be found inside .eslintrc.js. We also have some specific configuration that is applied for tests only. It is located inside tests/.eslintrc.js file.

It extends the default configuration with the new rules that are applied for test frameworks that we use.

jsdoc

We lint annotation. The rule is simple: if you write jsdoc you should write a correct one. You may not write them at all (however, that's not good).

We use to lint them.

Vue

These checks are executed together with javascript linting.

Styles

stylelint is not related with eslint at all. It is a standalone tool. Other plugins for languages like stylus, sass, and post-css can also be installed if you need them.

To run css linting execute: npm run lint:css.

Configuring stylelint

a11y

We also ship a rich set of accessability checks for both stylelint and eslint with the help of:

Please, do not turn it off! Let's make our apps better!

Markdown

To run md linting execute: npm run lint:md.

Configuring remark

package.json

It checks for multiple things including: ordering, naming, bashism, aliasing, etc.

This is simple tool, but a very useful one. Check out the docs for more information.

Afterwords

Linting can be easily changed to any other styles you like (or forced to use).

We also lint .vue files with the help of .

We use awesome to validate our css and scss files. We also use strict config here. We stick to .

All configuration is done . It stores presets, rules, and plugins.

We lint markdown files with . This tool allows us to write consistent documentation and README files.

We use docs/.remarkrc.js to configure remark. Read more about .

We also use file to ignore programmatically generated files.

We use package to force correct "scripts" section definition in package.json.

eslint-plugin-vue
stylelint
stylelint-config-strict-scss
eslint-plugin-vue-a11y
stylelint-a11y
remark-lint
configuration
.remarkignore
scriptlint
wemake
jsdoc
eslint-plugin-jsdoc
inside stylelint.config.js