Maison >interface Web >js tutoriel >Comment mettre en place un environnement de développement pour angulairejs ? Analyse du processus de construction d'un environnement de développement avec angulairejs

Comment mettre en place un environnement de développement pour angulairejs ? Analyse du processus de construction d'un environnement de développement avec angulairejs

寻∝梦
寻∝梦original
2018-09-06 15:28:181447parcourir

Cet article présente principalement angularjs la création d'un environnement de développement. Voici le processus de création de l'environnement de développement Angularjs. Si vous ne voulez pas voir ce que vous voulez voir, commençons à lire cet article ensemble

1. Tout d'abord, présentons brièvement les fonctionnalités d'Angular-cli :

Angular-cli peut rapidement construire un framework et créer des modules, des services, des classes, des directives, etc.

a la fonction de webpack, qui peut réaliser la séparation de code, le chargement à la demande, etc. 🎜>

configure automatiquement l'environnement de développement, l'environnement de test et l'environnement de production peuvent réaliser l'empaquetage de code, la compression et le déploiement à chaud, ainsi que les tests de modules et les tests de bout en bout

Angular-cli peut identifier automatiquement la pré-compilation de sass et moins via le suffixe ;

Angular-cli peut configurer TypeScript lors de la création, et peut également effectuer des configurations personnalisées

La structure du projet créée via Angular-cli est ; une bonne pratique et peut être utilisé dans des environnements de production ;

2. Commencez maintenant à installer nodejs :

AngularJS doit utiliser Nodejs, nous devons donc d'abord installer nodejs. Nous devons utiliser nodejs. L'adresse de téléchargement de nodejs est : https://nodejs.org/en/download/ (Si vous voulez en voir plus, rendez-vous sur le site Web PHP chinois

Colonne Manuel de référence AngularJS )

3. npm et cnpm doivent être installés ici

L'étape suivante consiste à installer npm

NPM est un outil de gestion de packages installé avec. avec NodeJS. Il peut résoudre de nombreux problèmes dans le déploiement de code NodeJS. Les scénarios d'utilisation courants sont les suivants :

Permet aux utilisateurs de télécharger des packages tiers écrits par d'autres à partir du serveur NPM pour une utilisation locale.

Permet aux utilisateurs de télécharger et d'installer des programmes en ligne de commande écrits par d'autres à partir du serveur NPM pour une utilisation locale.

Permet aux utilisateurs de télécharger des packages ou des programmes en ligne de commande qu'ils écrivent sur le serveur NPM pour que d'autres puissent les utiliser.

L'installation de nodejs et npm est terminée ici. Cependant, il y aura quelques problèmes si vous utilisez npm pour l'installer dans Datianchao, nous utilisons donc cnpm pour l'installer, qui est également un package de npm.

Installez cnpm, exécutez la commande : npm i -g cnpm

Après avoir exécuté cette commande, attendez la fin, puis entrez la version de cnpm pour vérifier si l'installation est déjà terminée. ici, pour que tu puisses entrer.

Après avoir installé cnpm, nous commençons à installer Angular-cli.

Exécutez la commande : cnpm i -g angulaire-cli

Ensuite, vous pouvez exécuter la commande ng version pour vérifier si l'installation est terminée et la version d'angular-cli

Une fois l'installation terminée, nous pouvons utiliser la commande ng pour commencer à créer le projet.

4. Créez maintenant le projet :

Après avoir installé angulaire-cli, vous pouvez créer le projet directement. Exécutez la commande : ng new JustForTest

Parmi eux, JustForTest est le nom du projet

L'exécution de cette commande créera beaucoup de fichiers, et vous devrez attendre. Cette étape prendra beaucoup de temps, et vous devrez attendre l'installation de nod_. les modules sont terminés

Commencez directement en utilisant ng serve.

De cette façon, vous pouvez démarrer le projet directement. On rentre dans le navigateur : http://localhost:4200 et vous pouvez accéder directement à :

5. maintenant en cours d'importation

Si nous recherchons un projet en ligne, comment pouvons-nous le démarrer localement ? Faisons-le en détail :

Je recommande à tout le monde de jeter un œil à ce tutoriel du professeur Da Mo : le didacticiel vidéo Angular2.0 est ici

Pour la démonstration ici, nous utilisons également un projet. du professeur Da Mo : NiceFish, nous devons d'abord cloner le projet via git, ce qui ne sera pas démontré ici. Voici l'adresse du projet NiceFish : http://git.oschina.net/mumu-osc/NiceFish

.

Une fois le projet cloné, la ligne de commande entre dans le répertoire où se trouve le projet.

Exécutez la commande : cnpm i -g @angular/cli

Laissez-moi vous expliquer ici que nous avons déjà installé le Angular-cli global.

Attendez la fin de l'exécution de la commande, puis exécutez la commande : cnpm install

Puis exécutez la commande : ng serve -prod -aot

Puis attendez la compilation à terminer.

Une fois terminé, nous pouvons entrer dans le navigateur :

http://localhost:4200 pour accéder au projet.

Ensuite, il n'y en a plus. Cet article sur le processus de construction et de développement d'Angularjs se termine ici (si vous souhaitez voir plus de connaissances liées à Angularjs, rendez-vous sur le site Web PHP chinois

Manuel d'apprentissage AngularJS

Apprentissage des colonnes). Si vous avez des questions, vous pouvez les poser ci-dessous. [Recommandation de la rédaction]

Comment développer des applications web avec angulairejs ? Exemples de développement d'applications web avec angulairejs


Connaissez-vous le principe de routage d'angularjs ? Voici les principes détaillés du routage angulairejs

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn