web-dev-qa-db-fra.com

Manière correcte d’importer et d’utiliser lodash dans Angular

Auparavant, je pouvais utiliser une méthode lodash dans Angular avec une instruction d'importation ressemblant à ceci:

import {debounce as _debounce} from 'lodash';

Je reçois maintenant l'erreur suivante lors de l'utilisation de cette déclaration:

'"{...}/node_modules/@types/lodash/index"' has no exported member 'debounce'.

La seule chose qui compilera sans erreur est cette déclaration:

import * as _ from 'lodash';

Dans mon code, je change _debounce() en _.debounce(). Est-ce la seule façon (et/ou correcte) de le faire? Existe-t-il un moyen d'importer uniquement le rebond, ou est-ce que cela n'a pas d'importance en raison du "treehaking"? Je me rends compte que je peux écrire ma propre fonction anti-rebond, mais je m'intéresse surtout à la "bonne" façon de le faire.

p.s. Autres variations que j'ai essayées (chacune est associée à une sorte d'erreur): 

import {debounce as _debounce } from 'lodash/debounce';
import * as _debounce from 'lodash/debounce';
import debounce = require('lodash/debounce');

FYI ... J'utilise les versions suivantes:

Angulaire: 2.4.5

TypeScript: 2.1.5 

Angular-cli: 1.0.0-beta.26

angulartypescriptangular-cli
26
jloosli

(si vous vous souciez de secouer les arbres, voir update)}
Je suppose que pour apporter le lodash à votre projet que vous avez déjà fait 

npm install lodash --save
npm install @types/lodash --save-dev

Si vous souhaitez importer uniquement les fonctions requises, procédez comme suit:

import * as debounce from 'lodash/debounce'

ou 

import { debounce } from "lodash";

Utilisez-le comme:

debounce()

BTW: Vous devrez peut-être rétrograder votre version de TypeScript vers 2.0.10 car vous utilisez angular 2.x.

npm install [email protected] --save-dev

METTRE À JOUR:

Récemment, j'ai réalisé que lodash package n'est tout simplement pas arboré, donc si vous avez besoin de trois secousses, utilisez simplement lodash-es .

npm install lodash-es --save
npm install @types/lodash-es --save-dev

import debounce from 'lodash-es/debounce'
55
Kuncevič

J'ai eu le même problème et cela a commencé à fonctionner après avoir changé "@ types/lodash" en version "4.14.50".

0
Dawid Lubowiecki

Cela a résolu pour moi, comme écrit sous "mis à jour" par Kuncevič et édité par Roy 

yarn add lodash-es
yarn add @types/lodash-es --dev

import { debounce as _debounce } from 'lodash';

Je devais importer les es-modules, sinon on me donnait des erreurs de compilation - probablement à cause de ma configuration (tsconfig.json).

0
Marcus Ekström