21-腾讯云Webify项目部署原创

我们继续的来学习V的高级应用这一章，我们来看一下如何将我们构建好的项目部署到腾讯云web上去。腾讯云webfi，也就是web云托管，它支持从get仓库直接部署我们的V项目。我们可以先在本地构建一个生产版本，通过we build来完成，这个我们在前面已经介绍过了。第二步呢，我们将项目发布到get half上去，首先我们在远端创建一个github仓库，然后将本地代码发布到giate上去。第三步我们要注册腾讯云的账号，下面呢是一个腾讯云的网址，大家直接按照官网的指引去完成就可以了。第四步呢，我们要做web云托管的项目部署，这个地址是我们云托管项目部署的官方的文档，大家仔细的去参阅就可以。接下来呢，我们详细的给大家演示一下如何将我们的项目部署到腾讯云的web上去。

返回Vs code的，我们在项目根目录下面创建一个新的项目，执行一下PM PM create。我们去给项目起个名字，叫做advanced deploy。项目部署我们选择view view，然后进入到v advance deploy。然后执行PN PM install来去安装一下项目的依赖，接下来呢，我们直接PN PM run build来去构建一下我们项目的应用，构建好了以后呢，我们会在我们deploy这个文件夹下面生成一个data这样的目录，那么接下来呢，我们就把我们这个项目部署到这个腾讯云web上去。首先呢，我们先得需要在远端的giateub上面去创建一个仓库，我们回到浏览器，打开我的github，大家呢可以去进入到自己的giu仓库里，然后点击new。

我们去给下面的仓库起个名字，叫做v advanced-deploy然后我们点击create response，等待片刻以后呢，就会创建一个远端的仓库，我们可以copy这句话。然后回到我们的命令行，清一下屏，在项目的根目录下面，我们执行一下get in ne，这样就在我们刚前的这个项目下创建一个空的get本地仓库，然后将我们刚才复制的那句话粘贴过来，就是get remote at origin，后边呢是一个我们远端的仓库的地址，然后接下来我们执行回车，这样的话我们本地和远端的仓库就关联起来了，然后我们执行get at点将我们本地的代码提交到我们的索引库里，然后我们执行get commit，然后我们加个注释叫做deploy view3。

Project回车，好，接下来我们再去执行一下get push，将我们的项目push到远端的仓库里，我们现在把这句话复制一下，粘贴回车，我们看这里告诉我们不能够连接到远端的仓库里，应该是网络瞬间出了问题，然后我们再次执行get push setupstream origin master，然后我们再回车，就会直接的。把我们的项目发布到远端的仓库里了，我们现在回到浏览器刷新一下页面。好，我们看到这个项目呢，已经部署到远端的github仓库里了，好，细心的小伙伴应该发现了，我们这个项目的目录下面的Dis是灰色的，这是为什么呢？因为我们在get ignore里边配置了Dis这个目录，这样的话呢，我们本地的发布的data文件夹并不能够提交到我们远端的dataate仓库里，这样的话会不会影响我们腾讯云的发布呢？不会，我们腾讯云的webify会帮助我们构建Dis这个目录，所以呢，我们就不用把这个文件夹传递到远端，我们再次回到github，我们看到在这个目录下面的确是没有this这个文件夹。

那么接下来呢，我们就把我们这个项目部署到腾讯云的服务器上去，我们打开腾讯云的官网 HTTPScloud.tencent.com，然后呢，我们可以去免费注册一个账号，这里呢，我们就不详细的演示了，大家注册就好了，好接下来呢，我们再在这个地方点击登录，这样的话我们就可以登录我们账号了。

大家呢，可以用微信登录，这个比较方便，大家打开微信，然后扫一扫去扫描我们这个二维码，扫描完了以后呢，它会提示确认登录。那我们点击确认登录，允许他访问我们手机的一些资源，然后呢，我们就登录到腾讯云的这个网站上来了，然后大家呢，可以点击控制台。在这里边可以选择自己喜欢的腾讯云的产品，比方说我们划到云产品这个地方往下拉，看到这里有个云开发，这里有很多云开发的产品，包括cloud base，包括云托管base run，以及腾讯云微搭地代码，还有web应用托管，现在呢，我们用的就是web应用托管，大家点击一下。然后这里有个概览，告诉我们还没有应用，那我们就可以创建一个应用。

我们点击创建应用。这里呢，直接跳到了从getate仓库里选择，因为我之前已经做过getate仓库的选择了，如果大家的账号是第一次创建应用，那么它第一步会让你选择get仓库，比如选择GIHUB还是GET1，我选择的是GIHUB，所以呢它就帮助我们记忆下来了，那一步的话呢，大家点选一下就可以。那接着我们来看到我的gate仓库，它会自动的帮助我们关联进来。这里头看到七分钟前我们曾经创建过一个项目，叫做we advanced deploy，那我们直接点击导入。导入进来以后呢，这里边有几个构建命令是默认的，首先我们看第一个应用名称，这就是我们在get HUB里面创建的仓库的名字，第二呢，框架预设，它里边自动的帮我们选择了V，当然你可以选择其他的，比方说像view JS的view c Li等等。后边的构建命令我们都不用去改了，我们也改不了，一个是n PM run build输出的目录呢是this，大家发现没有，实际上我们不需要把this目录推送到GI上去，因为我们的腾讯云的webify会帮助我们输出这个目录。

那安装的命令呢，就是n PM install了，然后我们点击部署应用。这里我们点击我已知悉创建应用就可以了。稍等片刻以后呢，这里边就显示了我们部署的进度，这个每个进度呢，都需要花点时间，大家稍微等待一下，第一步它先做初始化资源，第二步呢要构建应用，第三步要做应用的部署，最后呢发布成功，第二步和第三步需要点构建时间，大家耐心的等待，这里呢，大家要保证网络畅通，保证我们的网络能轻松的访问GI。有的小伙伴呢，可能是选择GET1，这样可能会更快一些，我还是方便使用getup，所以呢，我们的项目就部署到getub上去了，现在正在进行部署应用，大家稍等片刻。

在部署过程中，你也可以看看构建的日志，我们往下拉。它会把我们的构建的日志都打印到我们当下的浏览器里。我们看到这里它的一步已经完成了，也就是我们的构建已经完成了，现在正在部署，稍等片刻。这个web应用托管呢，默认情况下是免费的，大家可以作为我们测试来用，如果是你产生了一些流量，或者是扩展其他的应用，可能要收费。所以呢，现在我们对于刚开始学习这个腾讯云的发布，或者说学习我们应用的部署的话，大家就可以直接使用这个免费的流程来去完成我们的任务了。我们要稍微等一会儿部署应用的话呢，需要点时间。

好，应用部署完成了以后呢，这里边显示发布成功了，成功了以后，我们现在就可以点击我们应用的列表了，这里呢就显示了我们当前应用的名称和域名，注意这里给了我们提供了一个免费的域名，我们可以通过这个域名来访问我们的部署好的应用，我们点击一下这个域名，但发现现在呢，它还是有些问题，因为呢，它部署完了以后，需要做一些CDN的发布，所以呢，我们要等待一到三分钟，我们可以点击一下概览。在这里边我们看到现在CDN配置生效中，也就是说它在做一些CDN的配置，所谓CDN叫内容分发网络，它需要把我们的资源同步到各个CDN的服务器上去，对啊，这块需要等大概三到五分钟。好了，现在呢，我们的这个应用就部署好了，我们可以点击一下这个地址，大家发现我们的应用就部署成功了。

我们再来看一下V的官网，我们输入 Vgs.cn，在这里边呢，我们找到部署静态站点，大家看我们使用的是腾讯云的webfi，这是官网给我们推荐的，你也可以使用官网推荐的其他的一些部署静态站点的方案。关于部署静态站点，我们就讲这么多，大家加油。