web-dev-qa-db-fra.com

Comment créer un serveur localhost pour exécuter un projet AngularJS

j'ai utilisé Xampp et JetBrain WebStorm pour exécuter un projet AngularJS. Mais c'est compliqué et peu performant. Existe-t-il un autre moyen de gérer un projet AngularJS?

angularjs
97
Pham Minh Tan

Si vous utilisez node.js http-server , c'est très simple.

Installer

npm install -g http-server

Après l'installation cd dans votre dossier de projet et exécutez

http-server -o

-o est d'ouvrir le navigateur à la page. Exécutez http-server --help pour afficher d'autres options telles que la modification du numéro de port.

Vous n'avez pas node ?:

ces autres one-liners pourrait être plus facile si vous n'avez pas installé node/npm.

Par exemple, python est préinstallé sur la plupart des systèmes, donc les serveurs python de John Doe ci-dessous seraient plus rapides.

Comme Mac OS est installé avec Ruby, c’est donc une autre option facile si vous utilisez un Mac: Ruby -run -ehttpd . -p8000 et ouvrez votre navigateur à http://localhost:8000.

211
lyjackal

Python a une commande intégrée spécialement conçue pour faire tourner un serveur Web:

Python3.x:

python -m http.server 8000

Autres versions:

python -m SimpleHTTPServer 8000

Lancer un serveur Web sur le port 8000

(Python est une condition préalable à cela; si vous n'avez pas installé python, les autres réponses pourraient être plus faciles)

35
user70585

Vous pouvez commencer par installer Node.js depuis terminal ou cmd:

apt-get install nodejs-legacy npm

Puis installez les dépendances:

npm install

Ensuite, démarrez le serveur:

npm start
21
Amar Syla

cd <your project folder> (où se trouve le code déployable de votre angularjs)

Sudo npm install serve -g

servir

Vous pouvez frapper votre page à

localhost: 3000 ou adresse IP: 3000

5
Anandkumar

J'utilise:

  • exprimer et
  • morgan

Installez Node.js. et npm. npm est installé avec Node.js

Placé dans le répertoire racine du projet

$ cd <your_angularjs_project>

La commande suivante crée package.json

$ npm init

Installez express ==> Rapide, sans opinion, minimaliste pour le noeud:

$ npm install express --save

Installer le middleware de morgan ==> HTTP Request Logger pour node.js

$ npm install morgan --save

créer le fichier server.js

ajoutez le code suivant dans le fichier server.js

// Required Modules
var express    = require("express");
var morgan     = require("morgan");
var app        = express();

var port = process.env.PORT || 3002;

app.use(morgan("dev"));
app.use(express.static("./"));

app.get("/", function(req, res) {
    res.sendFile("./index.html"); //index.html file of your angularjs application
});

// Start Server
app.listen(port, function () {
    console.log( "Express server listening on port " + port);
});

Enfin, lancez votre projet AngularJS sur le serveur localhost:

$ node server.js
4
Luis Ricardo Cayetano Herrera
  • Courir
ng servir

Cette commande est exécutée dans votre terminal après l’emplacement de votre dossier de projet, comme ~/my-app$

  • Ensuite, exécutez la commande - il affichera l'URL NG Live Development Server écoute sur localhost:4200

  • Ouvrez votre navigateur sur http: // localhost: 42

3
Lakshmana Rao Kuna

Si vous êtes un Java guy simple, placez votre dossier angular dans le dossier de contenu Web de votre application Web et déployez-le sur votre serveur Tomcat. Super facile!

2
Suyash Tilhari

"En supposant que vous avez installé nodejs",

mini-http est un outil très facile en ligne de commande pour créer un serveur http,
installe le paquet globalement npm install mini-http -g
puis, en utilisant votre cmd (terminal), exécutez mini-http -p=3000 dans votre répertoire de projet Et boum! vous avez créé un serveur sur le port 3000 maintenant allez vérifier http: // localhost: 30

Remarque: il n'est pas nécessaire de spécifier un port. Vous pouvez simplement exécuter mini-http ou mh pour démarrer le serveur.

2
menem salama

Utilisez le paquet npm local-web-server.

https://www.npmjs.com/package/local-web-server

$ npm install -g local-web-server
$ cd <your-app-folder>
$ ws

En outre, vous pouvez exécuter

$ ws -p 8181

-p définit le port que vous souhaitez utiliser

Ensuite, accédez à votre navigateur et accédez à http: localhost: 8181 /

2
Leonardo Lima

Une application angular peut être déployée à l'aide de n'importe quel serveur Web sur localhost. Les options ci-dessous décrivent les instructions de déploiement pour plusieurs déploiements possibles de serveurs Web en fonction de vos exigences de déploiement.

Microsofts Internet Information Services (IIS)

  1. Windows IIS doit être activé

    1.1. Sous Windows, accédez au Panneau de configuration et cliquez sur Ajouter ou supprimer des programmes.

    1.2. Dans la fenêtre Ajout/Suppression de programmes, cliquez sur Ajouter/Supprimer des composants Windows.

    1.3. Cochez la case Internet Information Services (IIS), cliquez sur Suivant, puis sur Terminer.

    1.4. Copiez et extrayez le fichier Angular Application Zip dans le répertoire racine du serveur Web: C:\inetpub\wwwroot.

  2. L'application Angular est désormais accessible à l'aide de l'URL suivante: http: // localhost: 808

Serveur Web léger NPM

  1. Installation d'un serveur Web léger 1.1. Téléchargez et installez npm à partir de: https://www.npmjs.com/get-npm 1.2. Une fois que npm a été installé, ouvrez une commande et entrez: npm install -g http-server 1.3. Extrayez le fichier Angular Zip
  2. Pour exécuter le serveur Web, ouvrez une invite de commande, accédez au répertoire dans lequel vous avez précédemment extrait le fichier Angular et tapez: http-server
  3. L'application Angular est désormais accessible à l'aide de l'URL suivante: http: // localhost: 808

Serveur Web Apache Tomcat

  1. Installer Apache Tomcat version 8 1.1. Téléchargez et installez Apache Tomcat à partir de: https://Tomcat.Apache.org/ 1.2. Copiez et extrayez le fichier Angular Application Zip dans le répertoire racine du serveur Web C:\Program Files\Apache Software Foundation\Tomcat 7.0\webapps.
  2. L'application Angular est désormais accessible à l'aide de l'URL suivante: http: // localhost: 808
2
Chetan Laddha

Si vous avez utilisé Visual Studio Community ou toute autre édition pour votre projet angular, accédez au dossier du projet, tapez d'abord

C:\Project Folder> npm install -g serveur http Vous verrez ce qui suit: + [email protected] ajouté 25 paquets dans les versions 4.213

Ensuite, tapez C:\Project Folder> http-server –o

Vous verrez que votre application apparaît automatiquement à http://127.0.0.1:8080/

1
BCool

En supposant que vous avez déjà installé node.js, vous pouvez utiliser synchronisation du navigateur pour tester le navigateur de manière synchronisée.

1
Shabbir Haider

Vous pouvez également configurer l'environnement dans Visual Studio Code. Exécutez Ctrl + Shift + P, puis tapez ctr dans la zone qui apparaît et sélectionnez les tâches: Configure Task Runner, puis modifiez le fichier task.json comme suit: { "version": "0.1.0", "command": "Explorer", "windows": { "command": "Explorer.exe" }, "args": ["index.html"] }, enregistrez vos modifications, puis sélectionnez votre fichier index.html. et tapez Ctrl + Maj + B. Cela ouvrira le projet avec votre navigateur par défaut.

0
Chinedu Etoh