[typescript] typescript로 moment.js를 어떻게 가져올 수 있습니까?

Program / 글쓴이

Typescript를 배우려고합니다. 관련성이 없다고 생각하지만이 데모에서는 VSCode를 사용하고 있습니다.

나는이 package.json거기에이 조각을 가지고 그 :

{
  "devDependencies": {
    "gulp": "^3.9.1",
    "jspm": "^0.16.33",
    "typescript": "^1.8.10"
  },
  "jspm": {
    "moment": "npm:moment@^2.12.0"
  }
}

그런 다음 다음 main.js과 같은 Typescript 클래스가 있습니다 .

import moment from 'moment';
export class Main {
}

내 gulpfile.js모습은 다음과 같습니다.

var gulp = require('gulp');
var typescript = require('gulp-tsb');
var compilerOptions = {
                        "rootDir": "src/",
                        "sourceMap": true,
                        "target": "es5",
                        "module": "amd",
                        "declaration": false,
                        "noImplicitAny": false,
                        "noResolve": true,
                        "removeComments": true,
                        "noLib": false,
                        "emitDecoratorMetadata": true,
                        "experimentalDecorators": true
                      };
var typescriptCompiler = typescript.create(compilerOptions);
gulp.task('build', function() {
  return gulp.src('/src')
    .pipe(typescriptCompiler())
    .pipe(gulp.dest('/dest'));
});

gulp 빌드를 실행하면 다음 메시지가 표시됩니다. "../main.ts(1,25): Cannot file module 'moment'."

사용 import moment = require('moment');하면 jspm이 작동하고 응용 프로그램을 실행할 때 모듈을 가져 오지만 여전히 빌드 오류가 발생합니다. 나는 또한 시도했다 :

npm install typings -g
typings install moment --ambient --save

하지만 문제를 개선하는 대신 악화되었습니다. 이제 빌드에서 위의 오류와 다음과 같은 오류가 발생합니다."../typings/browser/ambient/moment/index.d.ts(9,21): Cannot find namespace 'moment'."

입력을 통해 제공된 파일로 이동하여 파일 하단에 추가하면 :

declare module "moment" { export = moment; }

두 번째 오류가 사라질 수 있지만 내 main.ts파일 에서 작업 할 순간을 얻으려면 require 문이 여전히 필요하며 여전히 첫 번째 빌드 오류가 발생합니다.

.d.ts잠시 내 고유 한 파일 을 만들어야 합니까? 아니면 누락 된 설정 부분이 있습니까?

답변

최신 정보

분명히 moment는 이제 자체 유형 정의를 제공하므로 ( 최소한 2.14.1 이상 sivabudh 에 따라 ) 필요 typings하거나 전혀 필요하지 않습니다 @types.

import * as moment from 'moment' npm 패키지와 함께 제공되는 유형 정의를로드해야합니다.

그러나 moment / pull / 3319 # issuecomment-263752265 에서 말했듯 이 순간 팀은 이러한 정의를 유지하는 데 몇 가지 문제가있는 것 같습니다 (아직도이를 유지하는 사람을 찾고 있습니다) .

플래그 moment없이 타이핑 을 설치해야합니다 --ambient.

그런 다음 import * as moment from 'moment'

답변

TS에서 별도로 moment () 함수와 Moment 클래스 를 가져와야 합니다.

여기 typescript 문서 에서 메모를 찾았 습니다 .

/ * ~ ES6 모듈은 호출 가능한 함수를 직접 내보낼 수 없습니다.
* ~이 파일은 CommonJS 스타일을 사용하여 가져와야합니다.
* ~ import x = require ( ‘someLibrary’);

따라서 moment js를 typescript로 가져 오는 코드는 실제로 다음과 같습니다.

import { Moment } from 'moment'
....
let moment = require('moment');
...
interface SomeTime {
  aMoment: Moment,
}
...
fn() {
  ...
  someTime.aMoment = moment(...);
  ...
}

답변

이것이 언제 변경되었는지 확실하지 않지만 최신 버전의 typescript를 사용하면 import moment from 'moment';다른 모든 것이 정상적으로 작동합니다.

최신 정보:

최근에 수입을 고친 것 같습니다. 적어도 2.24.0당신은 사용하고 싶을 것입니다import * as moment from 'moment';

답변

타이핑을 통해

Moment.js는 이제 v2.14.1에서 TypeScript를 지원합니다.

참조 : https://github.com/moment/moment/pull/3280

직접

최선의 답은 아닐 수도 있지만 이것은 무차별 대입 방식이며 저에게 효과적입니다.

  1. 실제 moment.js파일을 다운로드 하여 프로젝트에 포함하기 만하면 됩니다.
  2. 예를 들어 내 프로젝트는 다음과 같습니다.


$ tree
.
├── main.js
├── main.js.map
├── main.ts
└── moment.js

  1. 다음은 샘플 소스 코드입니다.

“`

import * as moment from 'moment';

class HelloWorld {
    public hello(input:string):string {
        if (input === '') {
            return "Hello, World!";
        }
        else {
            return "Hello, " + input + "!";
        }
    }
}

let h = new HelloWorld();
console.log(moment().format('YYYY-MM-DD HH:mm:ss'));
  1. node실행 하는 데 사용하십시오 main.js.

답변

제가 찬성하고 댓글을 단 답변이 모호하다는 것을 방금 깨달았습니다. 그래서 다음은 정확히 나를 위해 일한 것입니다. 현재 Moment 2.26.0및 TS에 있습니다 3.8.3.

코드에서 :

import moment from 'moment';

TS 구성에서 :

{
  "compilerOptions": {
    "esModuleInterop": true,
    ...
  }
}

CommonJS와 EMS 를 모두 구축 중이므로이 구성을 다른 구성 파일로 가져옵니다.

통찰력은 Express 사용과 관련된 이 답변 에서 비롯됩니다 . 더 일반적인 것이 아니라 Moment.js와 관련하여 검색하는 모든 사람을 돕기 위해 여기에 추가 할 가치가 있다고 생각했습니다.

답변

1. 설치 순간

npm install moment --save

2. typescript 파일에서이 코드를 테스트합니다.

import moment = require('moment');

console.log(moment().format('LLLL'));

답변

아직도 망가 졌나요? 을 제거해보십시오 @types/moment.

그래서 파일 @types/moment에서 패키지를 제거 package.json하고 다음을 사용하여 작동했습니다.

import * as moment from 'moment'

최신 버전의 moment을 필요로하지 않습니다@types/moment 유형이 이미 포함되어 있으므로 패키지가 .