저는 노드 앱을 구축 중이며 .js의 각 파일 내부에서 다양한 패키지에 필요한 작업을 수행했습니다.
let co = require("co");
하지만 점점
등. 그래서 typescript를 사용하면 전체 프로젝트에서 그러한 선언 / 요구 사항이 하나만있을 수있는 것 같습니다. let
현재 파일로 범위가 지정 되었다고 생각했기 때문에 이것에 대해 혼란 스럽습니다 .
방금 작동하는 프로젝트가 있었지만 리팩터링 후 이제 모든 곳에서 이러한 오류가 발생합니다.
누군가 설명 할 수 있습니까?
답변
오류 자체와 관련하여 함수 범위 대신 블록 범위에 존재하는 지역 변수 let
를 선언하는 데 사용됩니다 . 또한보다 엄격 하므로 다음과 같은 작업을 수행 할 수 없습니다.var
if (condition) {
let a = 1;
...
let a = 2;
}
또한 블록 case
내부의 절 switch
은 자체 블록 범위를 생성하지 않으므로 각 블록을 생성하는 데 case
사용하지 않고 여러에서 동일한 지역 변수를 다시 선언 할 수 없습니다 {}
.
가져 오기와 관련하여 TypeScript가 파일을 실제 모듈로 인식하지 못하고 겉보기에는 모델 수준 정의가 전역 정의가되기 때문에이 오류가 발생할 수 있습니다.
명시적인 할당을 포함하지 않는 표준 ES6 방식으로 외부 모듈을 가져 오십시오. 그러면 TypeScript가 파일을 모듈로 올바르게 인식해야합니다.
import * as co from "./co"
co
예상대로 이미 이름이 지정된 경우 여전히 컴파일 오류가 발생합니다 . 예를 들어, 이것은 오류가 될 것입니다.
import * as co from "./co"; // Error: import definition conflicts with local definition
let co = 1;
“cannot find module co” 오류가 발생하는 경우 …
TypeScript는 모듈에 대해 전체 유형 검사를 실행하므로 가져 오려는 모듈에 대한 TS 정의가없는 경우 (예 : 정의 파일이없는 JS 모듈이기 때문에) 정의 파일 에서 모듈을 선언 할 수 있습니다 .d.ts
. 모듈 수준 내보내기를 포함하지 않습니다.
declare module "co" {
declare var co: any;
export = co;
}
답변
내가 얻을 수있는 가장 좋은 설명은 Tamas Piro의 포스트에서 입니다.
TLDR; TypeScript는 전역 실행 환경을 위해 DOM 유형을 사용합니다. 귀하의 경우에는 전역 창 개체에 ‘co’속성이 있습니다.
이를 해결하려면 :
- 변수 이름을 바꾸거나
- TypeScript 모듈을 사용하고 빈 내보내기 {}를 추가합니다.
export {};
또는
- DOM 유형을 추가하지 않고 컴파일러 옵션을 구성하십시오.
TypeScript 프로젝트 디렉터리에서 tsconfig.json을 편집합니다.
{
"compilerOptions": {
"lib": ["es6"]
}
}
답변
Node.JS Typescript 애플리케이션을 컴파일 할 때 이와 유사한 오류가 발생했습니다.
node_modules/@types/node/index.d.ts:83:15 - error TS2451: Cannot redeclare block-scoped variable 'custom'.
수정은 이것을 제거 하는 것입니다.
"files": [
"./node_modules/@types/node/index.d.ts"
]
다음과 같이 바꾸려면 :
"compilerOptions": {
"types": ["node"]
}
답변
IIFE(Immediately Invoked Function Expression)
, IIFE 사용
(function () {
all your code is here...
})();
답변
이 시대에 오는 사람들을 위해 여기에이 문제에 대한 간단한 해결책이 있습니다. 적어도 백엔드에서 나를 위해 일했습니다. 프런트 엔드 코드로 확인하지 않았습니다.
다음을 추가하십시오.
export {};
코드 상단에 있습니다.
답변
동일한 문제가 발생했으며 내 솔루션은 다음과 같습니다.
// *./module1/module1.ts*
export module Module1 {
export class Module1{
greating(){ return 'hey from Module1'}
}
}
// *./module2/module2.ts*
import {Module1} from './../module1/module1';
export module Module2{
export class Module2{
greating(){
let m1 = new Module1.Module1()
return 'hey from Module2 + and from loaded Model1: '+ m1.greating();
}
}
}
이제 서버 측에서 사용할 수 있습니다.
// *./server.ts*
/// <reference path="./typings/node/node.d.ts"/>
import {Module2} from './module2/module2';
export module Server {
export class Server{
greating(){
let m2 = new Module2.Module2();
return "hello from server & loaded modules: " + m2.greating();
}
}
}
exports.Server = Server;
// ./app.js
var Server = require('./server').Server.Server;
var server = new Server();
console.log(server.greating());
그리고 클라이언트 측에서도 :
// *./public/javscripts/index/index.ts*
import {Module2} from './../../../module2/module2';
document.body.onload = function(){
let m2 = new Module2.Module2();
alert(m2.greating());
}
// ./views/index.jade
extends layout
block content
h1= title
p Welcome to #{title}
script(src='main.js')
//
the main.js-file created by gulp-task 'browserify' below in the gulpfile.js
그리고 물론이 모든 것에 대한 꿀꺽 꿀꺽 파일 :
// *./gulpfile.js*
var gulp = require('gulp'),
ts = require('gulp-typescript'),
runSequence = require('run-sequence'),
browserify = require('gulp-browserify'),
rename = require('gulp-rename');
gulp.task('default', function(callback) {
gulp.task('ts1', function() {
return gulp.src(['./module1/module1.ts'])
.pipe(ts())
.pipe(gulp.dest('./module1'))
});
gulp.task('ts2', function() {
return gulp.src(['./module2/module2.ts'])
.pipe(ts())
.pipe(gulp.dest('./module2'))
});
gulp.task('ts3', function() {
return gulp.src(['./public/javascripts/index/index.ts'])
.pipe(ts())
.pipe(gulp.dest('./public/javascripts/index'))
});
gulp.task('browserify', function() {
return gulp.src('./public/javascripts/index/index.js', { read: false })
.pipe(browserify({
insertGlobals: true
}))
.pipe(rename('main.js'))
.pipe(gulp.dest('./public/javascripts/'))
});
runSequence('ts1', 'ts2', 'ts3', 'browserify', callback);
})
업데이트되었습니다.
물론 타입 스크립트 파일을 따로 컴파일 할 필요는 없습니다.
runSequence(['ts1', 'ts2', 'ts3'], 'browserify', callback)
완벽하게 작동합니다.
답변
업그레이드 할 때이 오류가 발생했습니다.
gulp-typescript 3.0.2 → 3.1.0
3.0.2로 되 돌리면 수정되었습니다.