@vue/tsconfig - npm Package Compare versions

Comparing version 0.3.2 to 0.4.0

package.json

		{
		"name": "@vue/tsconfig",
		"version": "0.3.2",
		"version": "0.4.0",
		"description": "A base TSConfig for working with Vue.js",
		@@ -5,0 +5,0 @@ "main": "tsconfig.json",

README.md

		@@ -7,3 +7,3 @@ # `@vue/tsconfig`

		[See below for the changes in v0.2.x.](#migrating-from-typescript--50)
		[See below for the changes in v0.3.x.](#migrating-from-typescript--50)

		@@ -40,5 +40,14 @@ ## Installation

		Then extend the Node.js tsconfig and the Vue tsconfig in your `tsconfig.json`:
		If you are not using any bundlers, the Node.js code doesn't rely on any Vue/Vite-specific features, then these would be enough, you may not need to extend the Vue TSConfig:

		```json
		"extends": "@tsconfig/node18/tsconfig.json",
		"compilerOptions": {
		"types": ["node"]
		}
		```

		Otherwise, if you are trying to use Vue components in Node.js environments (e.g. Server Side Rendering, Vitest, etc.), you will need to extend the Vue TSConfig along with the Node.js TSConfig:

		```json
		"extends": [
		@@ -48,5 +57,5 @@ "@tsconfig/node18/tsconfig.json",
		],
		"compilerOptions": [
		"compilerOptions": {
		"types": ["node"]
		]
		}
		```
		@@ -64,4 +73,10 @@

		- `moduleResolution` changed from `node` to [`bundler`](https://devblogs.microsoft.com/typescript/announcing-typescript-5-0/#moduleresolution-bundler)
		- The `lib` option in `tsconfig.dom .json` now includes `ES2020` by default.
		- `moduleResolution` changed from `node` to [`bundler`](https://devblogs.microsoft.com/typescript/announcing-typescript-5-0/#moduleresolution-bundler). This aligns more closely to the actual resolution rules in modern bundlers like Vite. However, some existing code may be broken under this new mode
		- Most notably, it implies [`"resolvePackageJsonExports": true`](https://www.typescriptlang.org/tsconfig#resolvePackageJsonExports) by default, so it prefers the [`exports` field of `package.json` files](https://nodejs.org/api/packages.html#exports) when resolving a third party module.
		- Some third party packages may not have this field set up correctly, but the bugs were previously hidden by the `node` mode.
		- Some notable packages include `vue-i18n@9.2.2`, `vuetify@3.2.3`, `v-calendar@3.0.3`, etc.
		- While `vue-i18n` [has fixed this issue in v9.3 beta](https://github.com/intlify/vue-i18n-next/issues/1327#issuecomment-1539491735), and vuetify [will solve the issue in v3.3](https://github.com/vuetifyjs/vuetify/commit/5e08832fabe80ddc839907d13c7279a091ddfee5), other packages may not be so quick to fix. In that case, you can override the `compilerOptions.resolvePackageJsonExports` option to `false` in your `tsconfig.json` to temporarily work around the issue.
		- But we encourage you to submit PRs to these packages to fix the bugs, so that we can all move forward to the new resolution mode. You can use tools like [`publint`](https://publint.dev/) and [Are the types wrong?](https://arethetypeswrong.github.io/) to help you find and debug the issues.
		- Another small breaking change is that `--moduleResolution bundler` does not support resolution of `require` calls. In TypeScript files, this means the `import mod = require("foo”)` syntax is forbidden.
		- The `lib` option in `tsconfig.dom.json` now includes `ES2020` by default.
		- Previously it was ES2016, which was the lowest ES version that Vue 3 supports.
		@@ -68,0 +83,0 @@ - Vite 4 transpiles down to ES2020 by default, this new default is to align with the build tool.

tsconfig.json

		@@ -22,2 +22,3 @@ {
		"jsx": "preserve",
		"jsxImportSource": "vue",

		@@ -30,5 +31,2 @@ // `"noImplicitThis": true` is part of `strict`

		// Required in Vite
		"isolatedModules": true,

		// <https://devblogs.microsoft.com/typescript/announcing-typescript-5-0/#verbatimmodulesyntax>
		@@ -35,0 +33,0 @@ // Any imports or exports without a type modifier are left around. This is important for `<script setup>`.

@vue/tsconfig - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics

Worsened metrics