Comment créer un conteneur Docker d'une application AngularJS?

J'ai une application AngularJS qui a cette structure:

app/
----- controllers/
---------- mainController.js
---------- otherController.js
----- directives/
---------- mainDirective.js
---------- otherDirective.js
----- services/
---------- userService.js
---------- itemService.js
----- js/
---------- bootstrap.js
---------- jquery.js
----- app.js
views/
----- mainView.html
----- otherView.html
----- index.html

Comment puis-je créer mon propre image de ce et de le faire fonctionner sur un conteneur? J'ai essayé de courir, sans succès avec un Dockerfile et je suis relativement nouveau à Docker alors, toutes mes excuses si c'est simple. Je veux juste l'exécuter sur un serveur http (à l'aide de nginx peut-être?)

J'ai essayé ces pour de l'aide, sans succès:

Généralement le conteneur docker est purement les services web. Vous montez un volume lorsque vous exécutez le conteneur qui relie votre code dans la racine web dans le conteneur. Pour cette raison, docker et AngularJS sont mutuellement exclusives et vous pouvez utiliser n'importe quel générique Apache ou nginx conteneur docker pour exécuter votre application

OriginalL'auteur stop | 2016-11-20

  1. 17

    Tout d'abord, suivez ce guide des meilleures pratiques pour construire votre angulaire de l'application de la structure. L'index.html doit être placé dans le dossier racine. Je ne suis pas sûr si les étapes suivantes vont travailler, si elle n'est pas là.

    D'utiliser un nginx, vous pouvez suivre ce petit tutoriel: Dockerized Angulaire app avec nginx

    1.Créer un Dockerfile dans le dossier racine de votre application (à côté de votre index.html)

    FROM nginx
COPY .//usr/share/nginx/html
EXPOSE 80

    2.Exécuter docker build -t my-angular-app . dans le dossier de votre Dockerfile.

    3.docker run -p 80:80 -d my-angular-app et puis vous pouvez accéder à votre application http://localhost

    qu'est-ce que l'-t-il?
    le paramètre -t my-angular-app crée une balise de l'image créée. Donc, vous pouvez référencer my-angular-app dans le docker run de commande. Pour plus de détails, veuillez consulter le menu fixe docs: docker construire docs
    La COPIE de la commande est incorrecte, sauf si vous voulez servir de /dist. Le tutoriel que vous faites le lien est-il exact: COPY dist /usr/share/nginx/html
    Aussi, vous pourriez avoir de la difficulté à servir de port 80, selon votre système d'exploitation, car il est réservé.
    Pourquoi est - EXPOSE 80 nécessaires à cet enfant Dockerfile? Il n'est pas nécessaire dans la base de Dockerfile de nginx qui s'exécute sur le port 80 sans avoir besoin de EXPOSE 80, de sorte qu'il semble étrange que cela est nécessaire à l'enfant.

    OriginalL'auteur adebasi

  2. 8

    bâtiment sur @adebasi réponse, je tiens à souligner cette Dockerfile pour être utilisé avec de l'actuel Angulaire de la CLI demande.

    Il utilise des Dockers multi-étape fonctionnalités de génération introduit dans 17.05. Dans l'Étape 1, le Nœud contenant est utilisé pour créer une version. L'image finale sera l'utilisation de Nginx et statiquement livrer les fichiers construits.

    ### STAGE 1: Build ###    
# We label our stage as 'builder'
FROM node:8-alpine as builder

COPY package.json package-lock.json ./

RUN npm set progress=false && npm config set depth 0 && npm cache clean --force

## Storing node modules on a separate layer will prevent 
## unnecessary npm installs at each build
RUN npm i && mkdir /ng-app && cp -R ./node_modules ./ng-app

WORKDIR /ng-app

COPY . .

## Build the angular app in production mode and store the artifacts in dist folder
RUN $(npm bin)/ng build --prod --build-optimizer


### STAGE 2: Setup ###

FROM nginx:1.13.3-alpine

## Copy our default nginx config
COPY nginx/default.conf /etc/nginx/conf.d/

## Remove default nginx website
RUN rm -rf /usr/share/nginx/html/*

## From 'builder' stage copy over the artifacts in dist folder 
## to default nginx public folder
COPY --from=builder /ng-app/dist /usr/share/nginx/html

CMD ["nginx", "-g", "daemon off;"]
    Je l'ai invité, c'est pour Angular2
    Oui, c'est pour Angular2
    Ouais, donc la question était pour AngularJS mais je vous remercie pour cette trop.

    OriginalL'auteur Hedge

  3. 1

    Généralement,

    Panneau est utilisé pour dockerize applications. Maintenant une demande simplement de ne pas se compose de JavaScript seulement (comme AngularJS est un JS cadre), sauf si vous choisissez une extrémité arrière du cadre, comme le Node, ASP.NET de Base, Python, etc Donc, si vous avez seulement simple application HTML, utiliser un inversée-proxy ou un serveur web conteneur tel que mentionné par Robbie. Pour un cas simple (Nginx exemple):

    • Télécharger le Nginx Docker image à partir du Hub.
    • Utilisation de Volumes ou de créer votre propre image de tenir vos configurations
    • Exposer un port du conteneur à l'hôte.

    OriginalL'auteur Janshair Khan