Cómo incluir jQuery en una app de Angular 4
¡Atención!
Este post ha sido marcado como obsoleto y su contenido podría no ser relevante en este punto del tiempo por lo que no debería de tomarse en cuenta. Sin embargo sigue existiendo con fines históricos y de preservación de la información.
Estoy trabajando en una app de Angular 4 en la cuál tengo la necesidad de utilizar algunos plugins jQuery y para mi sorpresa no es un proceso tan fácil como pensaba, por lo que estuve investigando cuál era la manera de lograrlo.
Les quiero compartir lo que funcionó para mi:
Paso 1: Instalamos jQuery con npm
npm install jquery --save
De esta manera aseguramos que jQuery se agregue como una dependencia de nuestro proyecto y sea incluido en nuestro package.json.
Paso 2: Actualizamos ./angular-cli.json
Después de eso tenemos que ir al archivo ./angular-cli.json ubicado en la raíz de nuestro proyecto Angular CLI, abrirlo y dentro de la propiedad scripts incluimos el path de la librería jQuery que acabamos de instalar:
“scripts”: [ “../node_modules/jquery/dist/jquery.min.js” ]
Si ya estamos corriendo el servidor, es importante detenerlo y volverlo a levantar con
ng serve para que tome en cuenta los cambios que hicimos en ./angular-cli.json.Paso 3: Utilizamos jQuery en nuestra aplicación
Ahora podemos disponer de jQuery en nuestra aplicación, para hacerlo tenemos que importarlo en nuestro archivo app.component.ts:
import * as $ from ‘jquery’;
import * as jQuery from ‘jquery’;
Y eso sería todo lo que hay que hacer, en realidad no es tan complicado, pero para principiantes como yo fue algo tricky descubrir la manera correcta de hacerlo.
-
Kudos
- ¡Nuevo!