programing

Visual Studio 코드: 컴파일 형식 스크립트 모듈

css3 2023. 7. 19. 21:31

Visual Studio 코드: 컴파일 형식 스크립트 모듈

저는 방금 새로운 Visual Studio Code를 다운로드했고 제 첫인상은 매우 긍정적입니다.타이프스크립트의 경우, 인텔리센스가 잘 작동합니다.

하지만 이상한 문제가 있습니다: VS Code는 typescript 모듈을 컴파일할 수 없는 것 같습니다.

다음 코드:

/// <reference path="../definitions/react.d.ts"/>

import React = require("react");

cmd에서 완벽하게 정상적으로 컴파일됩니다.

tsc --commonjs main.ts를 검색합니다.

그러나 VS Code에서 두 번째 줄이 빨간색으로 강조 표시되고 편집자가 다음과 같이 불평합니다.

"-module" 플래그가 제공되지 않으면 외부 모듈을 컴파일할 수 없습니다.

물론 모듈을 사용하는 모든 종류의 스크립트 코드는 이 플래그로 컴파일되어야 합니다.하지만 IDE가 모듈의 사용을 알고 있다면 왜 플래그를 설정하지 않습니까?모듈이 없는 형식 스크립트 코드는 저장 시 문제 없이 컴파일됩니다.

컴파일러 설정 구성 파일이 누락된 것 같습니다.그런 것이 있습니까?어디서 찾을 수 있습니까?

갱신하다

tsconfig.json 파일을 추가했습니다.

{
    "compilerOptions": {
        "target": "ES5",
        "module": "commonjs",
        "sourceMap": true
    }
}

이렇게 하면 실제로 오류가 제거됩니다.안타깝게도 IDE는 더 이상 제 코드를 컴파일하지 않습니다.처음에 저는 config.json이 오류 메시지를 침묵시킬 것이라고 생각했지만, 그것은 그것보다 더 많은 것을 합니다.이제 Intellisense가 샘플 파일에서 작동합니다.가 면하력으로 .React자동 완성이 트리거되고 의미 있는 제안이 표시되므로 반응을 알고 있는 것으로 보입니다.

왜 VS Code는 파일을 js로 컴파일하지 않습니까?해당 작업을 수행하도록 태스크 실행기를 구성하려고 했지만 작동하지 않는 것 같습니다.

{
    "version": "0.1.0",

    // The command is tsc.
    "command": "tsc",

    // Show the output window only if unrecognized errors occur. 
    "showOutput": "silent",

    // Under windows use tsc.exe. This ensures we don't need a shell.
    "windows": {
        "command": "tsc.exe"
    },

    // args is the HelloWorld program to compile.
    "args": ["--module commonjs","${file}"],

    // use the standard tsc problem matcher to find compile problems
    // in the output.
    "problemMatcher": "$tsc"
}

파일을 저장하면 빌드 작업을 명시적으로 실행해도 응답이 없습니다.제가 편집한 작업의 이름은 "tsc"입니다, 저도 그것을 실행하려고 했습니다.효과 없음.그런 다음 인수를 다음으로 변경했습니다."args": ["--module commonjs","main.ts"]응답 없음.

갱신하다

작업 실행기가 작동하는 유일한 방법은 다음 두 가지 설정을 사용하는 것입니다.

"args": ["${file}"], 
"isShellCommand": true, 

다음은 출력입니다.

  • "args": ["-p"],
  • "args": ["-p", "."],

오류 TS5023: 알 수 없는 컴파일러 옵션 'p'입니다.

  • "args": ["."],

오류 TS6053: '.ts' 파일을 찾을 수 없습니다.

저도 오늘 같은 문제에 직면했습니다.이 링크를 따라갔습니다. http://blogs.msdn.com/b/typescript/archive/2015/04/30/using-typescript-in-visual-studio-code.aspx 모든 설정 단계를 수행한 후 명령줄에서 이 명령을 실행하여 JavaScript 파일을 생성하기 시작했습니다.

npm install -g typescript

노드와 npm이 설치되어 있고 명령줄을 통해 액세스할 수 있는지 확인해야 합니다.내가 그것을 발견한 이유는 작동하지 않았기 때문입니다.tasks.json다음 옵션을 지정합니다.

"command": "tsc"
"isShellCommand": true,

그래서 비주얼 스튜디오 코드는 명령을 실행하려고 합니다.tsc명령행에서 찾을 수 없습니다.tsc그래서 npm을 사용하여 전체적으로 typscript를 설치하면 문제가 해결되었습니다.

저는 VS Code에 대한 다른 프로젝트에서 같은 문제를 겪었고 VS Code가 Typescript의 다른 버전을 사용하고 있다는 것을 알게 되었습니다.

다음은 출력입니다.

  • "args": ["-p"],
  • "args": ["-p", "."],

오류 TS5023: 알 수 없는 컴파일러 옵션 'p'입니다.

  • "args": ["."],

오류 TS6053: '.ts' 파일을 찾을 수 없습니다.

저는 npm의 1.5.3을 가지고 있었고 그는 1.0.3을 사용하고 있었습니다. 이는 Microsoft SDK에서도 시스템 유형 스크립트를 설치했고 PATH에서 액세스할 수 있었기 때문입니다.

글로벌 사용자 PATH에서 Microsoft SDK의 유형 스크립트를 제거하여 npm에서 -pargs를 관리할 수 있는 최신 스크립트에 액세스했습니다.

-v 인수로만 tsc 명령을 실행하여 올바른 버전인지 확인합니다.

코드 컴파일과 관련하여 tasks.json 파일은 다음과 같습니다.

{
    "version": "0.1.0",
    "command": "tsc",    
    "showOutput": "silent",
    "windows": {
        "command": "tsc.exe"
    },
    "args": ["-p", "."],    
    "problemMatcher": "$tsc"
}

윈도우즈에서 실행 중이고 전체적으로 tsc를 노드 모듈로 설치한 경우 윈도우즈 섹션을 다음으로 변경합니다.

"windows": {
    "command": "tsc",
    "isShellCommand": true
}

-p .args는 tsc 컴파일러에게 루트 폴더에서 tscconfig.json 파일을 찾아 프로젝트를 컴파일하는 데 사용하라고 말합니다.

프로젝트 루트에 tsconfig.json 파일을 생성해야 합니다.

세트"module": "commonjs"

기본 예:

{
    "compilerOptions": {
        "target": "ES5",
        "module": "commonjs",
        "sourceMap": true
    }
}

저도 같은 문제를 겪었고 스티브 펜튼이 제공한 스택 오버플로에서 솔루션을 찾았습니다. 저장비주얼 스튜디오 코드 컴파일입니다.그의 제안은 우아하고, 현재 VS Code 표준을 준수하며, 설명된 대로 즉시 작동합니다.파일 -> 환경설정 -> 키보드 바로 가기에 덮어쓰기로 추가:

[
    {
        "key": "ctrl+s",          
        "command": "workbench.action.tasks.build" 
    }
]

언급URL : https://stackoverflow.com/questions/30050262/visual-studio-code-compile-typescript-module