Comment moment.js peut-il être importé avec dactylographié?

J'essaye d'apprendre Typescript. Bien que je ne pense pas que ce soit pertinent, j'utilise VSCode pour cette démo.

J'ai un package.jsonqui contient ces pièces:

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

Ensuite, j'ai une classe Typescript main.jscomme celle-ci:

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

Mon gulpfile.jsressemble à ceci:

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'));
});

Quand je lance gulp build, je reçois le message: "../main.ts(1,25): Cannot file module 'moment'."

Si j'utilise import moment = require('moment');alors jspm fonctionnera et apportera le module lorsque j'exécute l'application, mais je reçois toujours l'erreur de construction. J'ai aussi essayé:

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

Au lieu d’améliorer le problème, il s’est aggravé. Maintenant, j'obtiens l'erreur ci-dessus lors de la construction ainsi que les éléments suivants:"../typings/browser/ambient/moment/index.d.ts(9,21): Cannot find namespace 'moment'."

Si je vais dans le fichier fourni par les saisies et ajoute en bas du fichier:

declare module "moment" { export = moment; }

Je peux faire disparaître la deuxième erreur, mais j'ai toujours besoin de l'instruction require pour obtenir le moment de travailler dans mon main.tsfichier et j'obtiens toujours la première erreur de construction.

Dois-je créer mon propre .d.tsfichier pour le moment ou y a-t-il juste un élément de configuration qui me manque?

Mettre à jour

Apparemment, moment fournit maintenant ses propres définitions de type (selon sivabudh au moins à partir de 2.14.1), donc vous n'avez pas besoin typingsou pas @typesdu tout.

import * as moment from 'moment' devrait charger les définitions de type fournies avec le package npm.

Cela dit cependant, comme indiqué dans moment / pull / 3319 # issuecomment-263752265, l'équipe du moment semble avoir des problèmes pour maintenir ces définitions (elle cherche toujours quelqu'un qui les maintient) .

Vous devez installer des momenttypages sans le--ambient indicateur.

Puis incluez-le en utilisant import * as moment from 'moment'

Vous devez importer moment () la fonction et Moment la classe séparément dans TS.

J'ai trouvé une note dans la documentation dactylographiée ici .

/ * ~ Notez que les modules ES6 ne peuvent pas exporter directement les fonctions appelables
* ~ Ce fichier doit être importé en utilisant le style CommonJS:
* ~ import x = require ('someLibrary');

Ainsi, le code pour importer moment js dans un script dactylographié ressemble en fait à ceci:

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

Je ne sais pas quand cela a changé, mais avec la dernière version de tapuscript, il vous suffit d'utiliser import moment from 'moment'; et tout le reste devrait fonctionner normalement.

METTRE À JOUR:

On dirait que le moment récent a corrigé leur importation. Au moins, 2.24.0vous voudrez utiliserimport * as moment from 'moment';

via des typages

Moment.js prend désormais en charge TypeScript dans la v2.14.1.

Voir: https://github.com/moment/moment/pull/3280

Directement

Ce n'est peut-être pas la meilleure réponse, mais c'est la méthode de la force brute, et cela fonctionne pour moi.

1. Téléchargez simplement le moment.jsfichier réel et incluez-le dans votre projet.
2. Par exemple, mon projet ressemble à ceci:

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

3. Et voici un exemple de code source:

''

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'));

4. Utilisez juste nodepour courir main.js.

Je viens de remarquer que la réponse sur laquelle j'ai voté et commenté est ambiguë. Voici donc exactement ce qui a fonctionné pour moi. Je suis actuellement sur Moment 2.26.0et TS3.8.3 :

Dans du code:

import moment from 'moment';

Dans la configuration TS:

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

Je construis à la fois pour CommonJS et EMS, donc cette configuration est importée dans d'autres fichiers de configuration.

La perspicacité vient de cette réponse qui concerne l'utilisation d'Express. J'ai pensé que cela valait la peine d'ajouter ici, pour aider tous ceux qui recherchent en relation avec Moment.js, plutôt que quelque chose de plus général.

1. installez le moment

npm install moment --save

2. testez ce code dans votre fichier dactylographié

import moment = require('moment');

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

Encore cassé? Essayez de désinstaller @types/moment.

Donc, j'ai supprimé le @types/momentpackage du package.jsonfichier et cela a fonctionné en utilisant:

import * as moment from 'moment'

Les nouvelles versions de momentne nécessitent pas le @types/momentpackage car les types sont déjà inclus.