| 1 | # @vue/cli-plugin-typescript
|
| 2 |
|
| 3 | > 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 | Since `3.0.0-rc.6`, `typescript` is now a peer dependency of this package, so you can use a specific version of TypeScript by updating your project's `package.json`.
|
| 12 |
|
| 13 | 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.
|
| 14 |
|
| 15 | ## Caching
|
| 16 |
|
| 17 | [cache-loader](https://github.com/webpack-contrib/cache-loader) is enabled by default and cache is stored in `<projectRoot>/node_modules/.cache/ts-loader`.
|
| 18 |
|
| 19 | ## Parallelization
|
| 20 |
|
| 21 | [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`.
|
| 22 |
|
| 23 | `parallel` should be set to `false` when using Typescript in combination with non-serializable loader options, such as regexes, dates and functions. These options would not be passed correctly to `ts-loader` which may lead to unexpected errors.
|
| 24 |
|
| 25 | ## Installing in an Already Created Project
|
| 26 |
|
| 27 | ```bash
|
| 28 | vue add typescript
|
| 29 | ```
|
| 30 |
|
| 31 | ## Injected webpack-chain Rules
|
| 32 |
|
| 33 | - `config.rule('ts')`
|
| 34 | - `config.rule('ts').use('ts-loader')`
|
| 35 | - `config.rule('ts').use('babel-loader')` (when used alongside `@vue/cli-plugin-babel`)
|
| 36 | - `config.rule('ts').use('cache-loader')`
|
| 37 | - `config.plugin('fork-ts-checker')`
|