Skip to content

Commit dd6cd85

Browse files
committed
docs: readme for plugins
1 parent 7e058ea commit dd6cd85

File tree

9 files changed

+205
-49
lines changed

9 files changed

+205
-49
lines changed

packages/@vue/cli-plugin-babel/README.md

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
> babel plugin for vue-cli
44
5-
## Transpilation
5+
## Configuration
66

77
Uses Babel 7 + `babel-loader` + [@vue/babel-preset-app](https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/babel-preset-app) by default, but can be configured via `.babelrc` to use any other Babel presets or plugins.
88

@@ -19,10 +19,6 @@ module.exports = {
1919
}
2020
```
2121

22-
## Injected Config Rules
23-
24-
- `config.rule('js')`
25-
2622
## Caching
2723

2824
[cache-loader](https://github.com/webpack-contrib/cache-loader) is enabled by default and cache is stored in `<projectRoot>/node_modules/.cache/cache-loader`.
@@ -37,3 +33,10 @@ module.exports = {
3733
npm install -D @vue/cli-plugin-babel
3834
vue invoke babel
3935
```
36+
37+
## Injected webpack-chain Rules
38+
39+
- `config.rule('js')`
40+
- `config.rule('js').use('babel-loader')`
41+
- `config.rule('js').use('cache-loader')`
42+
- `config.rule('js').use('thread-loader')`

packages/@vue/cli-plugin-e2e-cypress/README.md

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -8,32 +8,32 @@ Cypress offers a rich interactive interface for running E2E tests, but currently
88

99
## Injected Commands
1010

11-
### `vue-cli-service e2e`
11+
- **`vue-cli-service e2e`**
1212

13-
run e2e tests headlessly with `cypress run`.
13+
run e2e tests headlessly with `cypress run`.
1414

15-
Options:
15+
Options:
1616

17-
```
18-
--url run e2e tests against given url instead of auto-starting dev server
19-
-s, --spec runs a specific spec file. defaults to "all"
20-
```
17+
```
18+
--url run e2e tests against given url instead of auto-starting dev server
19+
-s, --spec runs a specific spec file. defaults to "all"
20+
```
2121

22-
Additionally, [all Cypress CLI options for `cypress run` are also supported](https://docs.cypress.io/guides/guides/command-line.html#cypress-run).
22+
Additionally, [all Cypress CLI options for `cypress run` are also supported](https://docs.cypress.io/guides/guides/command-line.html#cypress-run).
2323

24-
### `vue-cli-service e2e:open`
24+
- **`vue-cli-service e2e:open`**
2525

26-
run e2e tests in interactive mode with `cypress open`.
26+
run e2e tests in interactive mode with `cypress open`.
2727

28-
Options:
28+
Options:
2929

30-
```
31-
--url run e2e tests against given url instead of auto-starting dev server
32-
```
30+
```
31+
--url run e2e tests against given url instead of auto-starting dev server
32+
```
3333

34-
Additionally, [all Cypress CLI options for `cypress open` are also supported](https://docs.cypress.io/guides/guides/command-line.html#cypress-open).
34+
Additionally, [all Cypress CLI options for `cypress open` are also supported](https://docs.cypress.io/guides/guides/command-line.html#cypress-open).
3535

36-
Both commands automatically starts a server in production mode to run the e2e tests against. If you want to run the tests multiple times without having to restart the server every time, you can start the server with `vue-cli-service serve --mode production` in one terminal, and then run e2e tests against that server using the `--url` option.
36+
Both commands automatically starts a server in production mode to run the e2e tests against. If you want to run the tests multiple times without having to restart the server every time, you can start the server with `vue-cli-service serve --mode production` in one terminal, and then run e2e tests against that server using the `--url` option.
3737

3838
## Configuration
3939

packages/@vue/cli-plugin-e2e-nightwatch/README.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,20 @@
44
55
## Injected Commands
66

7-
### `vue-cli-service e2e`
7+
- **`vue-cli-service e2e`**
88

9-
run e2e tests with [NightwatchJS](nightwatchjs.org).
9+
run e2e tests with [NightwatchJS](nightwatchjs.org).
1010

11-
Options:
11+
Options:
1212

13-
```
14-
--url run e2e tests against given url instead of auto-starting dev server
15-
-e, --env specify comma-delimited browser envs to run in (default: chrome)
16-
-t, --test sepcify a test to run by name
17-
-f, --filter glob to filter tests by filename
18-
```
13+
```
14+
--url run e2e tests against given url instead of auto-starting dev server
15+
-e, --env specify comma-delimited browser envs to run in (default: chrome)
16+
-t, --test sepcify a test to run by name
17+
-f, --filter glob to filter tests by filename
18+
```
1919

20-
Additionally, [all Nightwatch CLI options are also supported](https://github.com/nightwatchjs/nightwatch/blob/master/lib/runner/cli/cli.js).
20+
Additionally, [all Nightwatch CLI options are also supported](https://github.com/nightwatchjs/nightwatch/blob/master/lib/runner/cli/cli.js).
2121

2222
## Configuration
2323

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,33 @@
11
# @vue/cli-plugin-eslint
22

33
> eslint plugin for vue-cli
4+
5+
## Injected Commands
6+
7+
- **`vue-cli-service lint`**
8+
9+
Lints and fixes files in `src` and `test`.
10+
11+
## Configuration
12+
13+
ESLint can be configured via `.eslintrc` or the `eslintConfig` field in `package.json`.
14+
15+
Lint-on-save during development with `eslint-loader` can be enabled with the `lintOnSave` option in `vue.config.js`:
16+
17+
``` js
18+
module.exports = {
19+
lintOnSave: true
20+
}
21+
```
22+
23+
## Installing in an Already Created Project
24+
25+
``` sh
26+
npm install -D @vue/cli-plugin-eslint
27+
vue invoke eslint
28+
```
29+
30+
## Injected webpack-chain Rules
31+
32+
- `config.rule('eslint')`
33+
- `config.rule('eslint').use('eslint-loader')`

packages/@vue/cli-plugin-pwa/README.md

Lines changed: 26 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -5,29 +5,29 @@
55
## Configuration
66

77
Configuration is handled via the `pwa` property of either the `vue.config.js`
8-
file, or the `"vue"` field in `package.json`.
8+
file, or the `"vue"` field in `package.json`.
99

10-
### pwa.workboxPluginMode
10+
- **pwa.workboxPluginMode**
1111

12-
This allows you to the choose between the two modes supported by the underlying
13-
[`workbox-webpack-plugin`](https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin).
12+
This allows you to the choose between the two modes supported by the underlying
13+
[`workbox-webpack-plugin`](https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin).
1414

15-
- `'GenerateSW'` (default), will lead to a new service worker file being created
16-
each time you rebuild your web app.
15+
- `'GenerateSW'` (default), will lead to a new service worker file being created
16+
each time you rebuild your web app.
1717

18-
- `'InjectManifest'` allows you to start with an existing service worker file,
19-
and creates a copy of that file with a "precache manifest" injected into it.
18+
- `'InjectManifest'` allows you to start with an existing service worker file,
19+
and creates a copy of that file with a "precache manifest" injected into it.
2020

21-
The "[Which Plugin to Use?](https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin#which_plugin_to_use)"
22-
guide can help you choose between the two modes.
21+
The "[Which Plugin to Use?](https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin#which_plugin_to_use)"
22+
guide can help you choose between the two modes.
2323

24-
### pwa.workboxOptions
24+
- **pwa.workboxOptions**
2525

26-
These options are passed on through to the underlying `workbox-webpack-plugin`.
26+
These options are passed on through to the underlying `workbox-webpack-plugin`.
2727

28-
For more information on what values are supported, please see the guide for
29-
[`GenerateSW`](https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin#full_generatesw_config)
30-
or for [`InjectManifest`](https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin#full_injectmanifest_config).
28+
For more information on what values are supported, please see the guide for
29+
[`GenerateSW`](https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin#full_generatesw_config)
30+
or for [`InjectManifest`](https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin#full_injectmanifest_config).
3131

3232
### Example Configuration
3333

@@ -45,3 +45,14 @@ module.exports = {
4545
},
4646
};
4747
```
48+
49+
## Installing in an Already Created Project
50+
51+
``` sh
52+
npm install -D @vue/cli-plugin-pwa
53+
vue invoke pwa
54+
```
55+
56+
## Injected webpack-chain Rules
57+
58+
- `config.plugin('workbox')`
Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,52 @@
11
# @vue/cli-plugin-typescript
22

33
> typescript plugin for vue-cli
4+
5+
Uses TypeScript + `ts-loader` + [fork-ts-checker-webpack-plugin](https://github.com/Realytics/fork-ts-checker-webpack-plugin) for faster off-thread type checking.
6+
7+
## Configuration
8+
9+
TypeScript can be configured via `tsconfig.json`.
10+
11+
This plugin can be used alongside `@vue/cli-plugin-babel`. When used with Babel, this plugin will output ES2015 and delegate the rest to Babel for auto polyfill based on browser targets.
12+
13+
By default, `ts-loader` is only applied to files inside `src` and `test` directories. If you wish to explicitly transpile a dependency module, you will need to configure webpack in `vue.config.js`:
14+
15+
``` js
16+
module.exports = {
17+
chainWebpack: config => {
18+
config
19+
.rule('ts')
20+
.include
21+
.add(/module-to-transpile/)
22+
}
23+
}
24+
```
25+
26+
## Injected Commands
27+
28+
If opted to use [TSLint](https://palantir.github.io/tslint/) during project creation, `vue-cli-service lint` will be injected.
29+
30+
## Caching
31+
32+
[cache-loader](https://github.com/webpack-contrib/cache-loader) is enabled by default and cache is stored in `<projectRoot>/node_modules/.cache/cache-loader`.
33+
34+
## Parallelization
35+
36+
[thread-loader](https://github.com/webpack-contrib/thread-loader) is enabled by default when the machine has more than 1 CPU cores. This can be turned off by setting `parallel: false` in `vue.config.js`.
37+
38+
## Installing in an Already Created Project
39+
40+
``` sh
41+
npm install -D @vue/cli-plugin-typescript
42+
vue invoke typescript
43+
```
44+
45+
## Injected webpack-chain Rules
46+
47+
- `config.rule('ts')`
48+
- `config.rule('ts').use('ts-loader')`
49+
- `config.rule('ts').use('babel-loader')` (when used alongside `@vue/cli-plugin-babel`)
50+
- `config.rule('ts').use('cache-loader')`
51+
- `config.rule('ts').use('thread-loader')`
52+
- `config.plugin('fork-ts-checker')`
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,27 @@
11
# @vue/cli-plugin-unit-jest
22

33
> unit-jest plugin for vue-cli
4+
5+
## Injected Commands
6+
7+
- **`vue-cli-service test`**
8+
9+
Run unit tests with Jest. Default files matches are:
10+
11+
- Any files in `test/unit` that end in `.spec.(js|ts)`;
12+
- Any js/ts files inside `__tests__` directories.
13+
14+
Usage: `vue-cli-service test [options] <regexForTestFiles>`
15+
16+
All [Jest command line options](https://facebook.github.io/jest/docs/en/cli.html) are also supported.
17+
18+
## Configuration
19+
20+
Jest can be configured via `jest.config.js` in your project root, or the `jest` field in `package.json`.
21+
22+
## Installing in an Already Created Project
23+
24+
``` sh
25+
npm install -D @vue/cli-plugin-unit-jest
26+
vue invoke unit-jest
27+
```
Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,40 @@
11
# @vue/cli-plugin-unit-mocha
22

33
> unit-mocha plugin for vue-cli
4+
5+
## Injected Commands
6+
7+
- **`vue-cli-service test`**
8+
9+
Run unit tests with [mocha-webpack](https://github.com/zinserjan/mocha-webpack) + [chai](http://chaijs.com/).
10+
11+
**Note the tests are run inside Node.js with browser environment simulated with JSDOM.**
12+
13+
```
14+
Usage: vue-cli-service test [options] [...files]
15+
16+
Options:
17+
18+
--watch, -w run in watch mode
19+
--grep, -g only run tests matching <pattern>
20+
--slow, -s "slow" test threshold in milliseconds
21+
--timeout, -t timeout threshold in milliseconds
22+
--bail, -b bail after first test failure
23+
--require, -r require the given module before running tests
24+
--include include the given module into test bundle
25+
```
26+
27+
Default files matches are: any files in `test/unit` that end in `.spec.(ts|js)`.
28+
29+
All [mocha-wepback command line options](http://zinserjan.github.io/mocha-webpack/docs/installation/cli-usage.html) are also supported.
30+
31+
## Configuration
32+
33+
Jest can be configured via `jest.config.js` in your project root, or the `jest` field in `package.json`.
34+
35+
## Installing in an Already Created Project
36+
37+
``` sh
38+
npm install -D @vue/cli-plugin-unit-mocha
39+
vue invoke unit-mocha
40+
```

packages/@vue/cli-plugin-unit-mocha/index.js

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -40,11 +40,13 @@ module.exports = api => {
4040
'--webpack-config',
4141
require.resolve('@vue/cli-service/webpack.config.js'),
4242
...rawArgv,
43-
...(hasInlineFilesGlob ? [] : [`test/unit/**/*.js`])
43+
...(hasInlineFilesGlob ? [] : [
44+
api.hasPlugin('typescript')
45+
? `test/unit/**/*.spec.ts`
46+
: `test/unit/**/*.spec.js`
47+
])
4448
]
4549

46-
console.log(argv)
47-
4850
return new Promise((resolve, reject) => {
4951
const child = execa(bin, argv, { stdio: 'inherit' })
5052
child.on('error', reject)

0 commit comments

Comments
 (0)