我有一个AngularJS应用程序有这样的结构:
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
我如何去创build自己的图像,并在容器上运行它? 我已经尝试运行它与Dockerfile没有成功,我相对较新的Docker,所以很抱歉,如果这很简单。 我只是想在一个http服务器上运行它(使用nginx也许?)
我试过这些帮助,没有成功:
首先,按照这个最佳实践指南来构建您的角度应用程序结构。 index.html应放置在根文件夹中。 我不确定下面的步骤是否可行,如果不在那里。
要使用nginx,可以按照这个小教程: 使用nginx的Dockerized Angular应用程序
1.在您的应用程序的根文件夹中创建一个Dockerfile(在index.html旁边)
FROM nginx COPY ./ /usr/share/nginx/html EXPOSE 80
2.运行docker docker build -t my-angular-app .
在Dockerfile的文件夹中。
3. docker run -p 80:80 -d my-angular-app
然后你可以访问你的应用程序http:// localhost
建立在@adebasi答案我想突出显示这个Dockerfile与当前Angular CLI应用程序一起使用。
它使用了17.05年推出的Dockers的多阶段构建功能 。 在第1步中,Node容器仅用于创建构建。 最终的图像将使用Nginx并静态地传递构建的文件。
### 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;"]
通常,
Docker被用来dockerize 应用程序 。 现在,一个应用程序不仅仅是由JavaScript组成(除非你选择像Node,ASP.NET Core,Python等后端框架),所以如果你只有简单的HTML应用程序,使用反向代理或Robbie提到的Web服务器容器。 对于一个简单的例子(Nginx例子):