You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+19Lines changed: 19 additions & 0 deletions
Original file line number
Diff line number
Diff line change
@@ -38,6 +38,25 @@ You can turn on linting at the typechecker level by setting the `typeCheck` tsli
38
38
39
39
```
40
40
41
+
**Important**: Importing vue modules (ie. `import Hello from 'Hello.vue'`) will work fully within other .vue files (type information is retrieved)
42
+
without the need for a wildcard declaration. However, `.ts` modules that import `.vue` modules still require the wildcard declaration file:
43
+
44
+
```
45
+
// sfc.d.ts
46
+
declare module "*.vue" {
47
+
import Vue from "vue" // <-- this is not ideal, v2.0.0 will fix this!
48
+
export default Vue
49
+
}
50
+
51
+
```
52
+
The above will give the type as `vue` which is not ideal and defeats the purpose of TypeScript (your Vue modules extend Vue with more type information
53
+
that you have added on your module).
54
+
I've found a solution to this and I'm currently working on preparing it for **a 2.0.0 release** where the wildcard definition will no longer
55
+
be needed and type information from the module **will fully work!** Star the github repo
56
+
and watch this issue: https://github.com/prograhammer/vscode-tslint-vue/issues/4. In the meantime, you can double check yourself using the
57
+
Webpack plugin `fork-ts-checker-webpack-plugin`. See Webpack section further down below.
58
+
59
+
41
60
### Setup tsconfig.json
42
61
43
62
This extension assumes you have a `tsconfig.json` file located at the root of your current project/workspace. In your tsconfig file, ensure you don't exclude `.vue` files and also provide the wildcard path alias `@` so that it points to `src`:
Copy file name to clipboardExpand all lines: tslint/README.md
+24-6Lines changed: 24 additions & 6 deletions
Original file line number
Diff line number
Diff line change
@@ -2,7 +2,7 @@
2
2
3
3
[VSCode extension](https://marketplace.visualstudio.com/items?itemName=prograhammer.tslint-vue) for [tslint](https://github.com/palantir/tslint) with added support for .vue files (single file component) and compiler/typechecker level linting. This is a fork of [vscode-tslint](https://github.com/Microsoft/vscode-tslint).
4
4
5
-
*Note: See Quick Setup section further down for turning `typeCheck` on...*
5
+
*Note: See Quick Setup section further down for **new details** on turning `typeCheck` on...*
@@ -37,6 +37,23 @@ You can turn on linting at the typechecker level by setting the `typeCheck` tsli
37
37
}
38
38
39
39
```
40
+
**Important**: Importing vue modules (ie. `import Hello from 'Hello.vue'`) will work fully within other .vue files (type information is retrieved)
41
+
without the need for a wildcard declaration. However, `.ts` modules that import `.vue` modules still require the wildcard declaration file:
42
+
43
+
```
44
+
// sfc.d.ts
45
+
declare module "*.vue" {
46
+
import Vue from "vue" // <-- this is not ideal, v2.0.0 will fix this!
47
+
export default Vue
48
+
}
49
+
50
+
```
51
+
The above will give the type as `vue` which is not ideal and defeats the purpose of TypeScript (your Vue modules extend Vue with more type information
52
+
that you have added on your module).
53
+
I've found a solution to this and I'm currently working on preparing it for **a 2.0.0 release** where the wildcard definition will no longer
54
+
be needed and type information from the module **will fully work!** Star the github repo
55
+
and watch this issue: https://github.com/prograhammer/vscode-tslint-vue/issues/4. In the meantime, you can double check yourself using the
56
+
Webpack plugin `fork-ts-checker-webpack-plugin`. See Webpack section further down below.
40
57
41
58
### Setup tsconfig.json
42
59
@@ -93,7 +110,8 @@ Vue functionality. You can try it out early and read more at this [issue here](h
93
110
94
111
### VNext
95
112
96
-
- This is a fork of [vscode-tslint](https://marketplace.visualstudio.com/items?itemName=eg2.tslint) so you can find more information there. Soon
113
+
This is a fork of [vscode-tslint](https://marketplace.visualstudio.com/items?itemName=eg2.tslint) so you can find more information there. In upcoming
114
+
v2.0.0 release
97
115
I will update this code to fork from the newer, improved extension TSLint (vnext) [vscode-ts-tslint](https://marketplace.visualstudio.com/items?itemName=eg2.ts-tslint). Please refer to the tslint [documentation](https://github.com/palantir/tslint) for how to configure the linting rules.
98
116
99
117
### Prerequisites
@@ -103,13 +121,13 @@ To install tslint and typescript globally you can run `npm install -g tslint typ
103
121
104
122
# FAQ
105
123
106
-
-How can I use tslint rules that require type information
124
+
How can I use tslint rules that require type information?
107
125
108
-
Turn on typecheck in your VSCode settings.json (File > Preferences > Settings): `"tslint.typeCheck": true`.
126
+
-Turn on typecheck in your VSCode settings.json (File > Preferences > Settings): `"tslint.typeCheck": true`.
109
127
110
-
-Linting does not seem to work what can I do?
128
+
Linting does not seem to work what can I do?
111
129
112
-
Click on the `TSlint` status bar item at the bottom left of the status bar to see the output from the vscode-tslint-vue extension.
130
+
-Click on the `TSlint` status bar item at the bottom left of the status bar to see the output from the vscode-tslint-vue extension.
113
131
You can enable more tracing output by adding the setting "tslint.trace.server" with a value of "verbose" or "messages". If this doesn't
114
132
help then please file an [issue](https://github.com/Microsoft/vscode-tslint-vue/issues/new) and include the trace output produced when running with the setting "tslint.trace.server" set to "verbose". This is a fork of [vscode-tslint](https://github.com/Microsoft/vscode-tslint) so the issue may be need
0 commit comments