J'ai installé angular 6 avec foundation mais je reçois une erreur avec JQuery.
Erreur de syntaxe non détectée: identifiant inattendu ReferenceError: $ n'est pas défini
Dans ma composante, j'ai
declare var $:any
onNgInit () {
$(document).foundation()
}
J'ai toutes les importations dans mon angular.json
scripts : [
"node_modules/jquery/dist/jquery.js"
]
J'ai essayé tout ce que j'ai trouvé sur Internet, mais faisant toujours face à la même erreur J'ajoute aussi que cela fonctionnait quand je travaillais avec Angular 4
Ceci est lié au fonctionnement de l'isolation des modules ES6. Le chargement à partir du fichier angular.json
est identique à la balise de script d'un fichier index.html (la portée globale). Lorsque vous l'importez sur un composant, vous obtenez une nouvelle copie locale, évitez de l'importer de cette façon.
Pour empêcher intellisense et les problèmes de compilation, créez un fichier typings.d.ts
avec le contenu suivant:
declare var $: any;
declare var jQuery: any;
Maintenant vous êtes prêt à partir :)
Installer le plugin Jquery pour angular
npm install jquery --save
Maintenant, dans votre app.module.ts
ajouter
importer * comme $ de "jquery";
Cela fera le travail.
Pour ceux qui recherchent une réponse à cette question, la solution consiste à importer des types de nœud (je suppose que vous avez déjà utilisé npm pour installer --save jquery et foundation-sites):
npm install --save @types/node
puis dans votre tsconfig.app.json
sous votre module, assurez-vous que la section types (sous compilerOptions
) se lit comme suit:
"types": ["node"]
puis dans votre code:
import * as $ from 'jquery';
const Foundation = require('foundation-sites');
.... other declarations etc...
new Foundation.default.DropdownMenu($("#yourelementid"), {});
J'utilise le menu déroulant à titre d'exemple, mais cela devrait fonctionner avec tous les différents plugins de fondation (je n'ai pas encore testé).
Si vous avez jquery installé et obtenez toujours cette erreur. Dans chaque composant sur lequel vous utilisez $
, ajoutez en haut import * as $ from "jquery";
assurez-vous que votre chemin est correct?
essayez ceci [../ node_modules/jquery/dist/jquery.js]
Vous pouvez essayer d'ajouter les types jQuery. Je le fais après avoir installé jQuery à partir de npm.
npm install --save @ types/jquery