当前位置: 首页 > Web前端 > JavaScript

一个 Angular 开发人员对腾讯 Cloud Studio 使用后的体验报告

时间:2023-03-27 12:20:05 JavaScript

一个Angular开发者使用腾讯云工作室后的体验报告,所以平时访问的时候,由于网络原因,在本地编辑代码,运行编译好的Angular应用时,经常会感觉有延迟,影响用户体验。下图是StackBlitz在线编辑器的首页界面:听说腾讯这次推出了自己的CloudStudio,非常激动,立马在浏览器中试用了一下。使用CloudStudio创建第一个Angular应用程序。访问CloudStudio官网,发现支持微信和Github直接登录,连注册账号的过程都省了,非常方便。微信登录成功后,新建了一个工作区:在工作控件列表中,除了我最关心的Angular项目模板外,还有React、Vue、Hexo等众多项目项目模板。选择Angular项目模板后,CloudStudio会自动为Angular应用程序生成一个模板。我们观察里面的package.json,里面包含了Angular应用的所有依赖:Angular版本是~12.1.0,比较新。在CloudStudio中Angular应用编译运行相关的命令行中,我们可以看到CloudStudio在Terminal窗口中自动运行了如下命令行:setport=4200&&exportPORT=4200&&yarn&&yarnstart--port=4200只用了6多秒就完成了应用程序的编译。但是,下图的控制台输出有两个缺陷:(1)BuildAt时间戳的时区显示的是服务器的时区。个人认为,根据用户在浏览器中的时区设置,更加人性化。比如下图中,我期望时间戳显示的是我本地时间18:02:51,而不是服务器端的10:02:51。(2)打印的logAngularLiveDevelopmentServerislisteningonlocalhost:4200,打开浏览器在http://localhost:4200,这样会误导用户,因为实际上我们无法打开我们运行在Cloud中的Angular应用Studio通过在浏览器中直接访问http://localhost:4200/。正确的url应该是这个自动生成的url:https://dzdkkc-wbsddy-4200.preview.myide.io/这里我在Terminal中进行了更多的测试,比如直接执行命令行ngserve:discovertheentireapplication虽然它依然可以编译成功,当浏览器访问urlhttps://dzdkkc-wbsddy-4200.preview.myide.io时,遇到错误信息:InvalidHostheader,所以不知道如何继续,所以我必须继续使用冗长的命令行setport=4200&&exportPORT=4200&&yarn&&yarnstart--port=4200来启动应用程序。整个CloudStudio可以看做是一个运行在浏览器环境下的VisualStudioCode,所以对于笔者来说,没有学习曲线。笔者短暂的CloudStudio体验非常流畅,个人认为这是一款丝毫不逊色于StackBlitz的在线编辑器。笔者打算转而使用访问速度更快、更流畅的腾讯云Studio,而不是以后用StackBlitz做一些小的验证项目。