vite-esbuild-typescript-checker
Version:
* Speeds up [TypeScript](https://github.com/Microsoft/TypeScript) type checking * Supports [Vue Single File Component](https://vuejs.org/v2/guide/single-file-components.html) * Displays nice error messages with the [code frame](https://babeljs.io/docs/en/
91 lines (78 loc) • 2.24 kB
Markdown
## typescript | *.vue checker plugin for vite | esbuild | rollup
## Features
* Speeds up [TypeScript](https://github.com/Microsoft/TypeScript) type checking
* Supports [Vue Single File Component](https://vuejs.org/v2/guide/single-file-components.html)
* Displays nice error messages with the [code frame](https://babeljs.io/docs/en/next/babel-code-frame.html) formatter
* Prompt errors in Vite HMR overlay and terminal console
* Support both serve and build mode
**Motivation:** Vite and Esbuild are new and very fast build tools. But they do not have typescript type checking, as well as scripts in *.vue files. This plugin solves this problem. The "watch" mode is supported.
## Installation
```sh
# with npm
npm install --save-dev vite-esbuild-typescript-checker
# with yarn
yarn add -D vite-esbuild-typescript-checker
```
## Playground:
Examples of using the plugin are located in the "example" folder.
### EsBuild
```sh
cd example/esbuild
yarn install
yarn start
```
### EsBuild multiple entry points
```sh
cd example/esbuild2entry
yarn install
yarn start
```
### Vite
```sh
cd example/vite
yarn install
yarn dev | yarn build
```
## Vite example
```ts
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { VitePlugin } from 'vite-esbuild-typescript-checker';
export default defineConfig(({ command, mode, ssrBuild }) => {
return {
plugins: [vue(), VitePlugin({
basedir: __dirname,
watch: command === 'serve',
vue: {
enabled: true
}
}) as PluginOption]
}
});
```
## Esbuild example
```js
import * as esbuild from "esbuild";
import { nodeExternalsPlugin } from "esbuild-node-externals";
import { EsbuildPlugin } from "vite-esbuild-typescript-checker";
esbuild.build({
tsconfig: "./src/tsconfig.json",
target: ["esnext"],
entryPoints: ["src/index.ts"],
watch: false,
bundle: true,
minify: false,
sourcemap: true,
platform: "node",
outfile: "dist/index.js",
plugins: [
nodeExternalsPlugin({}),
EsbuildPlugin({
basedir: import.meta.dirname,
watch: false
})
]
}).catch(() => process.exit(1));
```
## License
MIT License