运用Docker建立Ionic2 PWA开辟环境 1

我想建立一个简朴的渐进式Web应用顺序(PWA),在挪动装备上运转,吸收用户数据并将其保存到背景。

我挑选了Ionic 2(疏忽了它建立当地应用顺序的才能),由于它基于Angular 2。它运用TypeScript作为其开辟言语。假如你刚最先打仗Angular(就像我一样),请前去Code School的Angular 2 Accellerating。深切相识。

在装置Ionic 2之前,您须要Node.js,由于它是Ionic 2所必需的。

关于Node.js

为了防止环境搭建污染我的MacBook,我挑选将我的开辟环境限定在一个Docker容器中,同时防止了克己软件和不可逆的当地装置顺序。

这将为您供应一个虚拟环境,能够随身携带,交给同事,以至宣布给任何人在几分钟内最先运用。

这不是教程。你将不得不亲身接见这些链接,以便控制,相识你要怎么做以及为何如许做。我在Node.js开辟者的Docker入门中松散地遵照了Heitor的窍门,跳过了Express,转而运用Ionic 2,而且疏忽了任何被弃用的(比方Boot2Docker)的东西。

▶装置
Docker for Mac入门指南:只需将Docker应用顺序拖到应用顺序文件夹即可。Windows用户应当转而运用Docker for Windows,Linux用户能够在Linux上装置Docker Engine

然后翻开终端并进入

docker run hello-world

为了考证你的装置是不是准确,你须要实行两个步骤,下载一个大众Docker镜像到你的计算机,实例化一个容器并运转一个Hello World应用顺序。

Docker就像引入到轻量级虚拟机的依靠注入,建立快照(即容器),并将它们导出为新的虚拟机(即Docker镜像)。它有一个基础设施来分享完全的解决方案。

▶你可挑选装置 Kitematic
一个用于治理Docker容器的可选GUI(Docker可视化治理工具)。这既不须要,也不是异常有效,然则关于Docker新手来讲,能够方便地探究Docker的全部内容。
windows上Kitematic的装置和运用能够参考如安在Windows上经由过程Kitematic运用Docker?
《运用Docker建立Ionic2 PWA开辟环境 1》

▶装置Ubuntu和Node.js.
Node.js有一个基于Debian的Docker镜像,然则我遵照Heitor的途径,它更接近于模拟实在的Linux装置,而且手动装置所需的一切东西。

稍后我将引见一种自动设置环境的要领。跳转到引见Dockerfiles

docker pull ubuntu
docker run ubuntu /bin/echo 'Hello World'
docker run -i -t ubuntu

您如今已经在一个Ubuntu的壳内里了。尝试ls -la并装置Node.js和npm:

ls -la
apt-get update


apt-get install curl
curl -sL https://deb.nodesource.com/setup_8.x | bash -

# 现在nodejs稳固的版本是8.94,假如须要其他版本能够修正上面那行代码中的setup_8.x

apt-get install nodejs
node -v


关于ionic 2

▶ 装置Ionic 2

npm install -g ionic
exit

如今将容器保存为一个新的镜像:

# Get your CONTAINER_ID
docker ps -a

# Save your container as a new image
docker commit -a 'YOUR_NAME <YOUR@EMAIL>' -m 'ionic2 devjump' \
    CONTAINER_ID my-ionic2:0.1
# 上面代码,用-a指定镜像作者,-m指定行建立的镜像的提交信息,接着是容器ID、目的镜像堆栈、镜像名。
docker tag my-ionic2:0.1 my-ionic2:latest

马上进入一个运转你的Ionic 2装置的新容器:

docker run -i -t -p 8100:8100 -p 35729:35729 my-ionic2

建立并最先您的第一个Ionic 2应用顺序:

ionic start cutePuppyPics sidemenu 

cd cutePuppyPics

# Would you like to integrate your new app with Cordova to target native iOS and Android? No
# ionic搭建pwa不须要cordova

ionic serve --all 

# without the --all Safari wouldn't connect to Ionic



《运用Docker建立Ionic2 PWA开辟环境 1》

如今转到Safari或Chrome并翻开http:// localhost:8100:
《运用Docker建立Ionic2 PWA开辟环境 1》

引见Dockerfiles和已装置的卷
功德圆满!您能够很想尝试最先开辟您的应用顺序 – 然则您不应当这么做!你的应用顺序的泉源仍然是Docker容器。一旦容器消逝了,你的资本也将消逝。

假如在你的Docker映像中丧失了任何东西或许必需转变它,那末极能够你将不得不从头最先,烦琐地复制粘贴和反复运转一切的语句。

我们将运用Dockerfile 来构建一个新的Docker镜像:

▶︎建立一个新的Dockerfile。注重:在Docker Hub的自动构建中,Dockerfile这个例子不会再收到任何提交。

下一篇文章将细致引见如何用Dockerfile搭建真正用于临盆环境的项目。

    原文作者:菠萝油王子
    原文地址: https://segmentfault.com/a/1190000013009386
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞