2017-02-18 102 views
1

我獨自跟着VS Code typescript配置。如何在VScode中設置打字稿?

https://code.visualstudio.com/Docs/languages/typescript

我安裝我的tsconfig.json像

{ 
    "compilerOptions": { 
     "module": "system", 
     "noImplicitAny": true, 
     "removeComments": true, 
     "preserveConstEnums": true, 
     "outFile": "built/local/tsc.js", 
     "sourceMap": true 
    }, 
    "include": [ 
     "**/*" 
    ], 
    "exclude": [ 
     "node_modules", 
     "**/*.spec.ts" 
    ] 
} 

,我的任務運行

{ 
    // See https://go.microsoft.com/fwlink/?LinkId=733558 
    // for the documentation about the tasks.json format 
    "version": "0.1.0", 
    "command": "tsc", 
    "isShellCommand": true, 
    "args": ["-p", "."], 
    "showOutput": "always", 
    "problemMatcher": "$tsc" 
} 

我的TS碼

class StartUp { 
    public static main(): number { 
     console.log('Helle Workd'); 
     return 5; 
    } 
} 
console.log('test'); 

StartUp.main(); 

對於一些reaso n,當我按下cmd + shift + B(build)時,在輸出窗口中看不到任何輸出。我確實看到如下錯誤:

hello.ts(8,1): error TS2304: Cannot find name 'ddd'. 

如果我在代碼中隨機添加ddd字符串。

有人可以幫我解決這個問題嗎?非常感謝!

+0

是生成的文件好嗎?也許你可以運行「tsc -p」。在控制檯。如果沒有錯誤,命令將不會輸出。 – Yuan

回答

1

命令「tsc -p。」在編譯時不會輸出任何錯誤,並且會生成所有已編譯的JavaScript/SourceMap文件,因此您無法在VSCode的輸出窗口中看到任何文件。只需在控制檯中鍵入並運行該命令即可。

您可以添加選項「--diagnostics」以使命令輸出一些信息。

{ 
    // See https://go.microsoft.com/fwlink/?LinkId=733558 
    // for the documentation about the tasks.json format 
    "version": "0.1.0", 
    "command": "tsc", 
    "isShellCommand": true, 
    "args": ["-p", ".", "--diagnostics"], 
    "problemMatcher": "$tsc" 
} 

輸出:

Files:   2 
Lines:  18225 
Nodes:  73338 
Identifiers: 24828 
Symbols:  18969 
Types:   4609 
Memory used: 62579K 
I/O read:  0.00s 
I/O write: 0.01s 
Parse time: 0.24s 
Bind time: 0.12s 
Check time: 0.54s 
Emit time: 0.06s 
Total time: 0.96s 

另請參閱http://www.typescriptlang.org/docs/handbook/compiler-options.html

0

安裝的應用程序結構 設置基本的HTML NPM初始化--yes NPM安裝精簡版服務器的所有選項--save- dev npm install --save-dev typescript @ types/node @ types/jasmine @ types/core-js 將腳本精簡版添加到package.json的腳本中 創建一個app文件夾 添加app.js 創建tsconfig.json 添加下列選項

{ 
"compilerOptions": { 
"target": "es5", 
"module": "commonjs", 
"moduleResolution": "node", 
"sourceMap": true, 
"emitDecoratorMetadata": true, 
"experimentalDecorators": true, 
"removeComments": false, 
"noImplicitAny": false, 
"lib": ["es2015", "dom"] 
} 
} 

添加以下到的package.json文件

{ 


"name": "Angular2", 

"version": "1.0.0", 

"description": "", 

"main": "index.js", 

"scripts": 
{ 

    "start": "concurrently \"npm run tsc:w\" \"npm run lite\"", 

    "lite": "lite-server", 
"tsc": "tsc", 
"tsc:w": "tsc -w" 
}, 

    "keywords": [], 
"author": "", 
"license": "ISC", 
"devDependencies": 
{ 

    "@types/core-js": "^0.9.43", 

    "@types/jasmine": "^2.8.2", 

    "@types/node": "^8.0.53", 

    "concurrently": "^3.5.1", 

    "lite-server": "^2.3.0", 

    "typescript": "^2.6.1" 
    }, 


    "dependencies": 
{ 

    "types": "^0.1.1" 

} 

}