@vue/typescript-plugin 3.2.4 → 3.2.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +70 -17
- package/index.js +22 -22
- package/lib/requests/getComponentMeta.d.ts +2 -2
- package/lib/requests/getComponentMeta.js +2 -2
- package/package.json +5 -5
package/README.md
CHANGED
|
@@ -1,28 +1,81 @@
|
|
|
1
|
-
# typescript
|
|
1
|
+
# @vue/typescript-plugin
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
<p>
|
|
4
|
+
<a href="https://www.npmjs.com/package/@vue/typescript-plugin"><img src="https://img.shields.io/npm/v/@vue/typescript-plugin.svg?labelColor=18181B&color=1584FC" alt="NPM version"></a>
|
|
5
|
+
<a href="https://github.com/vuejs/language-tools/blob/master/LICENSE"><img src="https://img.shields.io/github/license/vuejs/language-tools.svg?labelColor=18181B&color=1584FC" alt="License"></a>
|
|
6
|
+
</p>
|
|
4
7
|
|
|
5
|
-
|
|
8
|
+
A TypeScript language service plugin that enables `tsserver` to understand `.vue` files. This plugin is used by `@vue/language-server` to collaborate with the TypeScript language service.
|
|
6
9
|
|
|
7
|
-
|
|
10
|
+
## Installation
|
|
11
|
+
|
|
12
|
+
```bash
|
|
13
|
+
npm install @vue/typescript-plugin --save-dev
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
## Configuration
|
|
17
|
+
|
|
18
|
+
### VSCode
|
|
19
|
+
|
|
20
|
+
Create `.vscode/settings.json` in your project root:
|
|
8
21
|
|
|
9
22
|
```json
|
|
10
|
-
|
|
23
|
+
{
|
|
24
|
+
"typescript.tsdk": "node_modules/typescript/lib",
|
|
25
|
+
"typescript.enablePromptUseWorkspaceTsdk": true
|
|
26
|
+
}
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
### tsconfig.json
|
|
30
|
+
|
|
31
|
+
```jsonc
|
|
32
|
+
{
|
|
33
|
+
"compilerOptions": {
|
|
11
34
|
"plugins": [
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
},
|
|
17
|
-
],
|
|
18
|
-
},
|
|
35
|
+
{ "name": "@vue/typescript-plugin" }
|
|
36
|
+
]
|
|
37
|
+
}
|
|
38
|
+
}
|
|
19
39
|
```
|
|
20
40
|
|
|
21
|
-
|
|
41
|
+
## Provided Features
|
|
42
|
+
|
|
43
|
+
This plugin registers the following Vue-specific commands for `tsserver`:
|
|
44
|
+
|
|
45
|
+
| Command | Description |
|
|
46
|
+
| :--- | :--- |
|
|
47
|
+
| `_vue:projectInfo` | Get project information |
|
|
48
|
+
| `_vue:collectExtractProps` | Collect extractable props |
|
|
49
|
+
| `_vue:getImportPathForFile` | Get import path for a file |
|
|
50
|
+
| `_vue:getAutoImportSuggestions` | Get auto-import suggestions |
|
|
51
|
+
| `_vue:resolveAutoImportCompletionEntry` | Resolve auto-import completion entry |
|
|
52
|
+
| `_vue:isRefAtPosition` | Check if position is a ref |
|
|
53
|
+
| `_vue:getComponentDirectives` | Get component directives |
|
|
54
|
+
| `_vue:getComponentNames` | Get component name list |
|
|
55
|
+
| `_vue:getComponentMeta` | Get component metadata |
|
|
56
|
+
| `_vue:getComponentSlots` | Get component slots |
|
|
57
|
+
| `_vue:getElementAttrs` | Get element attributes |
|
|
58
|
+
| `_vue:getElementNames` | Get element name list |
|
|
59
|
+
| `_vue:resolveModuleName` | Resolve module name |
|
|
60
|
+
| `_vue:documentHighlights-full` | Document highlights |
|
|
61
|
+
| `_vue:encodedSemanticClassifications-full` | Semantic classifications |
|
|
62
|
+
| `_vue:quickinfo` | Quick info |
|
|
63
|
+
|
|
64
|
+
## How it Works
|
|
65
|
+
|
|
66
|
+
This plugin is created using `createLanguageServicePlugin` from `@volar/typescript`. It:
|
|
67
|
+
|
|
68
|
+
1. Reads `vueCompilerOptions` from `tsconfig.json`
|
|
69
|
+
2. Creates a Vue language plugin to process `.vue` files
|
|
70
|
+
3. Intercepts and handles TypeScript language service requests
|
|
71
|
+
4. Registers Vue-specific protocol handlers
|
|
72
|
+
|
|
73
|
+
## Related Packages
|
|
22
74
|
|
|
23
|
-
|
|
75
|
+
- [`@vue/language-core`](../language-core) - Core module
|
|
76
|
+
- [`@vue/language-server`](../language-server) - Language server
|
|
77
|
+
- [`vue-component-meta`](../component-meta) - Component metadata
|
|
24
78
|
|
|
25
|
-
|
|
79
|
+
## License
|
|
26
80
|
|
|
27
|
-
[
|
|
28
|
-
|
|
81
|
+
[MIT](https://github.com/vuejs/language-tools/blob/master/LICENSE) License
|
package/index.js
CHANGED
|
@@ -105,13 +105,13 @@ module.exports = (0, createLanguageServicePlugin_1.createLanguageServicePlugin)(
|
|
|
105
105
|
});
|
|
106
106
|
session.addProtocolHandler('_vue:collectExtractProps', request => {
|
|
107
107
|
const [fileName, templateCodeRange] = request.arguments;
|
|
108
|
-
const {
|
|
109
|
-
return createResponse((0, collectExtractProps_1.collectExtractProps)(ts, language,
|
|
108
|
+
const { program, language, sourceScript, virtualCode } = getProjectAndVirtualCode(fileName);
|
|
109
|
+
return createResponse((0, collectExtractProps_1.collectExtractProps)(ts, language, program, sourceScript, virtualCode, templateCodeRange, sourceScript.generated ? sourceScript.snapshot.getLength() : 0));
|
|
110
110
|
});
|
|
111
111
|
session.addProtocolHandler('_vue:getImportPathForFile', request => {
|
|
112
112
|
const [fileName, incomingFileName, preferences] = request.arguments;
|
|
113
|
-
const { project } = getProject(fileName);
|
|
114
|
-
return createResponse((0, getImportPathForFile_1.getImportPathForFile)(ts, project,
|
|
113
|
+
const { project, program } = getProject(fileName);
|
|
114
|
+
return createResponse((0, getImportPathForFile_1.getImportPathForFile)(ts, project, program, fileName, incomingFileName, preferences));
|
|
115
115
|
});
|
|
116
116
|
session.addProtocolHandler('_vue:getAutoImportSuggestions', request => {
|
|
117
117
|
const [fileName, position] = request.arguments;
|
|
@@ -194,40 +194,39 @@ module.exports = (0, createLanguageServicePlugin_1.createLanguageServicePlugin)(
|
|
|
194
194
|
});
|
|
195
195
|
session.addProtocolHandler('_vue:isRefAtPosition', request => {
|
|
196
196
|
const [fileName, position] = request.arguments;
|
|
197
|
-
const {
|
|
198
|
-
return createResponse((0, isRefAtPosition_1.isRefAtPosition)(ts, language,
|
|
197
|
+
const { program, language, sourceScript, virtualCode } = getProjectAndVirtualCode(fileName);
|
|
198
|
+
return createResponse((0, isRefAtPosition_1.isRefAtPosition)(ts, language, program, sourceScript, virtualCode, position, sourceScript.generated ? sourceScript.snapshot.getLength() : 0));
|
|
199
199
|
});
|
|
200
200
|
session.addProtocolHandler('_vue:getComponentDirectives', request => {
|
|
201
201
|
const [fileName] = request.arguments;
|
|
202
|
-
const {
|
|
203
|
-
return createResponse((0, getComponentDirectives_1.getComponentDirectives)(ts,
|
|
202
|
+
const { program } = getProject(fileName);
|
|
203
|
+
return createResponse((0, getComponentDirectives_1.getComponentDirectives)(ts, program, fileName));
|
|
204
204
|
});
|
|
205
205
|
session.addProtocolHandler('_vue:getComponentNames', request => {
|
|
206
206
|
const [fileName] = request.arguments;
|
|
207
|
-
const {
|
|
208
|
-
return createResponse((0, getComponentNames_1.getComponentNames)(ts,
|
|
207
|
+
const { program, virtualCode } = getProjectAndVirtualCode(fileName);
|
|
208
|
+
return createResponse((0, getComponentNames_1.getComponentNames)(ts, program, virtualCode));
|
|
209
209
|
});
|
|
210
210
|
session.addProtocolHandler('_vue:getComponentMeta', request => {
|
|
211
211
|
const [fileName, tag] = request.arguments;
|
|
212
|
-
const {
|
|
213
|
-
const program = project.getLanguageService().getProgram();
|
|
212
|
+
const { program, virtualCode, language } = getProjectAndVirtualCode(fileName);
|
|
214
213
|
const sourceFile = program.getSourceFile(virtualCode.fileName);
|
|
215
|
-
return createResponse((0, getComponentMeta_1.getComponentMeta)(ts, program, language, sourceFile, virtualCode, tag));
|
|
214
|
+
return createResponse((0, getComponentMeta_1.getComponentMeta)(ts, program, language, fileName => language.scripts.get(fileName), sourceFile, virtualCode, tag));
|
|
216
215
|
});
|
|
217
216
|
session.addProtocolHandler('_vue:getComponentSlots', request => {
|
|
218
217
|
const [fileName] = request.arguments;
|
|
219
|
-
const {
|
|
220
|
-
return createResponse((0, getComponentSlots_1.getComponentSlots)(ts,
|
|
218
|
+
const { program, virtualCode } = getProjectAndVirtualCode(fileName);
|
|
219
|
+
return createResponse((0, getComponentSlots_1.getComponentSlots)(ts, program, virtualCode));
|
|
221
220
|
});
|
|
222
221
|
session.addProtocolHandler('_vue:getElementAttrs', request => {
|
|
223
222
|
const [fileName, tag] = request.arguments;
|
|
224
|
-
const {
|
|
225
|
-
return createResponse((0, getElementAttrs_1.getElementAttrs)(ts,
|
|
223
|
+
const { program } = getProject(fileName);
|
|
224
|
+
return createResponse((0, getElementAttrs_1.getElementAttrs)(ts, program, fileName, tag));
|
|
226
225
|
});
|
|
227
226
|
session.addProtocolHandler('_vue:getElementNames', request => {
|
|
228
227
|
const [fileName] = request.arguments;
|
|
229
|
-
const {
|
|
230
|
-
return createResponse((0, getElementNames_1.getElementNames)(ts,
|
|
228
|
+
const { program } = getProject(fileName);
|
|
229
|
+
return createResponse((0, getElementNames_1.getElementNames)(ts, program, fileName));
|
|
231
230
|
});
|
|
232
231
|
session.addProtocolHandler('_vue:resolveModuleName', request => {
|
|
233
232
|
const [fileName, moduleName] = request.arguments;
|
|
@@ -241,8 +240,8 @@ module.exports = (0, createLanguageServicePlugin_1.createLanguageServicePlugin)(
|
|
|
241
240
|
};
|
|
242
241
|
}
|
|
243
242
|
function getProjectAndVirtualCode(fileName) {
|
|
244
|
-
const
|
|
245
|
-
const sourceScript =
|
|
243
|
+
const project = getProject(fileName);
|
|
244
|
+
const sourceScript = project.language.scripts.get(fileName);
|
|
246
245
|
if (!sourceScript) {
|
|
247
246
|
throw new Error('No source script found for file: ' + fileName);
|
|
248
247
|
}
|
|
@@ -251,7 +250,7 @@ module.exports = (0, createLanguageServicePlugin_1.createLanguageServicePlugin)(
|
|
|
251
250
|
throw new Error('No virtual code found for file: ' + fileName);
|
|
252
251
|
}
|
|
253
252
|
return {
|
|
254
|
-
...
|
|
253
|
+
...project,
|
|
255
254
|
sourceScript,
|
|
256
255
|
virtualCode,
|
|
257
256
|
};
|
|
@@ -266,6 +265,7 @@ module.exports = (0, createLanguageServicePlugin_1.createLanguageServicePlugin)(
|
|
|
266
265
|
}
|
|
267
266
|
return {
|
|
268
267
|
project,
|
|
268
|
+
program: project.getLanguageService().getProgram(),
|
|
269
269
|
language: project.__vue__.language,
|
|
270
270
|
};
|
|
271
271
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { Language, VueVirtualCode } from '@vue/language-core';
|
|
1
|
+
import type { Language, SourceScript, VueVirtualCode } from '@vue/language-core';
|
|
2
2
|
import type * as ts from 'typescript';
|
|
3
3
|
import type { ComponentMeta } from 'vue-component-meta';
|
|
4
|
-
export declare function getComponentMeta(ts: typeof import('typescript'), program: ts.Program, language: Language
|
|
4
|
+
export declare function getComponentMeta(ts: typeof import('typescript'), program: ts.Program, language: Language, getSourceScript: (fileName: string) => SourceScript | undefined, sourceFile: ts.SourceFile, virtualCode: VueVirtualCode, tag: string): ComponentMeta | undefined;
|
|
@@ -3,12 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.getComponentMeta = getComponentMeta;
|
|
4
4
|
const componentMeta_1 = require("vue-component-meta/lib/componentMeta");
|
|
5
5
|
const utils_1 = require("./utils");
|
|
6
|
-
function getComponentMeta(ts, program, language, sourceFile, virtualCode, tag) {
|
|
6
|
+
function getComponentMeta(ts, program, language, getSourceScript, sourceFile, virtualCode, tag) {
|
|
7
7
|
const checker = program.getTypeChecker();
|
|
8
8
|
const componentType = (0, utils_1.getComponentType)(ts, checker, sourceFile, virtualCode, tag);
|
|
9
9
|
if (!componentType) {
|
|
10
10
|
return;
|
|
11
11
|
}
|
|
12
|
-
return (0, componentMeta_1.getComponentMeta)(ts, checker, ts.createPrinter(), language, componentType.node, componentType.type, false);
|
|
12
|
+
return (0, componentMeta_1.getComponentMeta)(ts, checker, ts.createPrinter(), language, getSourceScript, componentType.node, componentType.type, false);
|
|
13
13
|
}
|
|
14
14
|
//# sourceMappingURL=getComponentMeta.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vue/typescript-plugin",
|
|
3
|
-
"version": "3.2.
|
|
3
|
+
"version": "3.2.6",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"files": [
|
|
6
6
|
"**/*.js",
|
|
@@ -13,15 +13,15 @@
|
|
|
13
13
|
"directory": "packages/typescript-plugin"
|
|
14
14
|
},
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@volar/typescript": "2.4.
|
|
17
|
-
"@vue/language-core": "3.2.
|
|
16
|
+
"@volar/typescript": "2.4.28",
|
|
17
|
+
"@vue/language-core": "3.2.6",
|
|
18
18
|
"@vue/shared": "^3.5.0",
|
|
19
19
|
"path-browserify": "^1.0.1",
|
|
20
|
-
"vue-component-meta": "3.2.
|
|
20
|
+
"vue-component-meta": "3.2.6"
|
|
21
21
|
},
|
|
22
22
|
"devDependencies": {
|
|
23
23
|
"@types/node": "^22.10.4",
|
|
24
24
|
"@types/path-browserify": "^1.0.1"
|
|
25
25
|
},
|
|
26
|
-
"gitHead": "
|
|
26
|
+
"gitHead": "94907be4f056f25867e46a117ab18d2782b425d7"
|
|
27
27
|
}
|