脚本宝典收集整理的这篇文章主要介绍了

使用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?
clipboard.png

▶安装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    

clipboard.png

现在转到Safari或Chrome并打开http:// localhost:8100:
clipboard.png

介绍Dockerfiles和已安装的卷
大功告成!您可能很想尝试开始开发您的应用程序 - 但是您不应该这么做!你的应用程序的来源仍然是Docker容器。一旦容器消失了,你的资源也将消失。

如果在你的Docker映像中丢失了任何东西或者必须改变它,那么很可能你将不得不从头开始,繁琐地复制粘贴和重复运行所有的语句。

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

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

下一篇文章将详细介绍如何用Dockerfile搭建真正用于生产环境的项目。

总结

以上是脚本宝典为你收集整理的

使用Docker创建Ionic2 PWA开发环境 1

全部内容,希望文章能够帮你解决

使用Docker创建Ionic2 PWA开发环境 1

所遇到的程序开发问题,欢迎加入QQ群277859234一起讨论学习。如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典网站推荐给程序员好友。 本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。

80%的人都看过