怎么在vscode编写HTML代码

scode怎么运行代码HTML?vscode是一款源代码编辑器软件，能够用于windows、macOS以及Linux系统，具有丰富的其他语言。网站html编写也需要使用到vscode，但是很多小伙伴们不知道如何运行编写html代码，那么今天就来教大家vscode怎么运行代码HTML以及怎么在vscode编写HTML代码，一起来看看吧。

VS Code中运行

代码有两种方法：

1.自动打开HTML文件

步骤如下：

1）在VS Code中搜索并安装Live Server插件；

2）打开HTML文件；

3）右键单击编辑器中的HTML代码，选择“Open with Live Server”；

4）浏览器将自动打开并显示HTML页面。

2.手动打开HTML文件

步骤如下：

1）打开HTML文件；

2）右键单击编辑器中的HTML代码，选择“Open with Default Application”；

3）浏览器将自动打开并显示HTML页面。

、使用dotnet new grpc -o GrpcGreeter && cd GrpcGreeter && code . ，进入项目文件中，使用code .使用vscode打开。

　　[注]你可能会遇到'code' command not found?

　　解决办法：1）首次使用打开vscode -> command+shift+p -> 输入shell -> 提示Shell Command:Install 'code' in PATH -> 点击安装

　　　　　　　2）额外知识点：mac在命令行中可以使用open .打开文件夹

2、项目文件打开了，这个时候我们使用dotnet run运行项目。

　　[注]你可能会遇到

　　1）https certificate not found

　　解决办法：一般的解决办法是直接按照提示运行dotnet dev-certs https --trust就可以了，但是我遇到了一个很奇葩的事情

　　2）cannot create developer certificate on Mac

　　解决办法：我重启了下电脑shutdown -r now，然后运行dotnet dev-certs https --trust，输入验证密码，然后ok了　　　

　　3）无法绑定到 IPv4 环回接口上的 https://localhost:5001：在 macOS 上不支持 HTTP/2，因为缺少 ALPN 支持。 "。

　　解决办法：无法在macOS启动ASP.NET Core gRPC应用

 1 public static IHostBuilder CreateHostBuilder(string[] args) =>
 2 　　Host.CreateDefaultBuilder(args)
 3 .ConfigureWebHostDefaults(webBuilder =>
 4 {
 5 webBuilder.ConfigureKestrel(options =>
 6 {
 7 options.ListenLocalhost(5000, o => o.Protocols = HttpProtocols.Http2);
 8 });
 9 webBuilder.UseStartup<Startup>();
10 });

3、创建客户端项目dotnet new console -o GrpcGreeterClient，并引入以下三个包：

　　dotnet add GrpcGreeterClient.csproj package Grpc.Net.Client

　　dotnet add GrpcGreeterClient.csproj package Google.Protobuf

　　dotnet add GrpcGreeterClient.csproj package Grpc.Tools

4、将服务端的Protos/greet.proto拷贝到客户端Protos/greet.proto下，并在GrpcGreeterClient.csproj项目文件中添加元素项组

<ItemGroup>
 <Protobuf Include="Protos\greet.proto" GrpcServices="Client" />
</ItemGroup>

5、在客户端程序中

using System;
using System.Net.Http;
using System.Threading.Tasks;
using GrpcGreeter;
using Grpc.Net.Client;

namespace GrpcGreeterClient
{
 class Program
 {
 static async Task Main(string[] args)
 {
 var channel = GrpcChannel.ForAddress("http://localhost:5000");
 var client = new Greeter.GreeterClient(channel);
 var reply = await client.SayHelloAsync(
 new HelloRequest { Name = "GreeterClient" });
 Console.WriteLine("Greeting: " + reply.Message);
 }
 }
}

6、运行客户端程序，发现报错

于是我们想到可能是我们为了解决http2问题引起的，如何解决呢？

　　解决办法：允许客户端进行不安全连接，添加下行代码

AppContext.SetSwitch("System.Net.Http.SocketsHttpHandler.Http2UnencryptedSupport", true);

7、客户-服务端正常通信

原文地址：https://www.cnblogs.com/az4215/p/11961331.html

没看现场的发布会，我是睡觉突然醒了直接看到微博上刷屏的信息，从床上跳下来，下载，试用，然后冒着猝死的风险来写下这篇试用体验。

首先对Visual Studio Code做一个大概的介绍。首先明确一下，这个Visual Studio Code（以下简称vscode）是一个带GUI的代码编辑器，也就是只能完成简单的代码编辑功能，并不是一个集成开发环境（IDE）。而Visual Studio、WebStorm这类的开发工具是IDE，功能强大，这两个是不一样的概念。

有些答案在讨论配置文件是JSON格式的，这个已经是Sublime、Atom这一类编辑器的标配了。另外，关于Web云端开发的支持，第一版本也没有相关的功能。目前仅仅就是一个编辑器而已，跟连接微软的后端云服务没啥关系。当然，可能以后的版本会加入直接连接云端进行开发吧。

目前市场上比较常见的一些GUI编辑器的产品：Sublime、Notepad++、Atom、H5 Builder、Brackets等等，包括终端下的Vim、Emacs等等，都是这个vscode的竞品。我个人比较常用Sublime，Atom少用，所以只能对比下Sublime。

以下从刚刚的试用情况来大概谈一谈编辑器独特的地方，仅供参考。

1、外观：

典型的VS风格的UI，支持light和dark两种theme切换。旁边按钮分别是新建、搜索、git和调试。不过功能布局情况，完全类似Atom。

2、性能：

Mac Air上将近300万行代码的文件，打开需要5、6秒，浏览无卡顿，无崩溃现象，继续coding也不卡顿，Go to Line也不卡顿，粘贴代码会卡顿、问题不大。Sublime3的最新版连打开这个文件，都要将近2分钟，根本不比了。

3、用户体验细节

这个我一点一点来说

（1）可以直接点击GUI按钮或者右键进行新建File、Folder这样的操作。（以前的Sublime这方面比较差）

（2）直接分离tab和关闭tab

左边的按钮可以直接split窗口。。比Sublime方便多了。右边的x可以直接关闭标签。

然后左侧还可以看到一个大的蓝色按钮，可以直接Open Folder，也比较爽。。这里也就直接暗示了以Folder为项目，不然很多新手弄不清楚打开文件、打开Folder什么的。

（3）无插件化的代码diff

非常强大的一个功能，目前发现两个方式可以启动diff功能。

第一种是在左侧，右键文件select to compare，然后再右键一个文件Compare with 'xx'，就可以出现diff。第二种是git的模式下，点击右上角的switch to changes file，就可以启动diff。

然后左上角点击...按钮，会出现

然后点击switch to Inline View，可以并到一个tab diff。

（4）代码补全支持Angular标签、支持函数说明提示

然后简单试了一下HTML和JS的代码补全（C#试了貌似没有补全，具体的再看）

HTML的补全算不错的，还支持Angular的标签补全。

JS的代码补全太帅了，直接看图吧，每个函数属性都有说明。支持Node补全。。

（5）自动提示覆盖配置文件&悬浮提示

这种编辑器，自己改配置文件也是很常见的。目前，不支持对不同语言进行独立配置，都是集成在一个配置文件里面；不过支持对不同项目有不同的配置文件，支持快捷键配置。

配置的时候有两点很nice：

1. 会自动打开Default Settings和User Settings，提示让你在右侧修改覆盖自己的配置文件。这个对新手很友好、也很方便。

2. 另外鼠标放到配置文件（JSON格式）的key上，会自动悬浮提示。

（6）语法错误提示&格式化代码&无插件化的代码Debug

内置了语法错误提示，很方便。

右键代码区域支持自动格式化代码，挺不错的。

编辑器还带了原生的Debug功能。

目前来看，配置文件主要是前端开发方面的配置，Debug支持Node和Mono（.Net）。

开启Debug功能，必须要Mono3.0安装好，我光调试Node也要安装，不清楚为什么。

点击左侧的Debug按钮，会自动在目录下生成Debug的配置文件

按照自己所需修改好，然后左侧选择要Debug的配置，然后就跑起来了。

（7）支持简单的多行选择

在单词上右键Change All Occurrences，然后就可以选择多行了。

现在唯一的问题就是不支持大家最关心的插件化，但是这只是刚开始，只是第一版，插件化对微软来说也应该只是分分钟。而且第一版放出来就支持插件化意义也不大，因为开发者们也都不知道微软要做这个东西，第一版放出来也没啥插件。我要是微软，第一版也不放，后续版本赶紧加进来就好，只要用户多，都不是事儿。而且右下角直接有一个笑脸可以拿来反馈信息，所以大家有什么想反馈的，直接点那个按钮。

综上，说完了一些吸引人的feature，放上我个人对其的初步评价，一个预期。

首先，免费开放肯定是非常好的消息，Sublime毕竟是收费的，Sublime 3连无限期免费试用都不行了。

其次，插件化、语言独立配置要赶紧加到日程里面，搞出来，这才是大炮。不过，以微软的水平，这个应该完全不是问题，而且官方文档里面也已经说了，这个是在日程上的事情。

再其次，用户体验的细节上，微软肯定是完爆Sublime的，见上文。

最后，对前端开发、Node、C#比较友好。以前搞前端开发的，特别是Mac和Linux的开发者，应该会比较倾向于这个了，估计很多都会把常用编辑器从Sublime换到这个了。C#开发者的话，应该还是在Windows上的开发者才会用的多，对他们而言，当做一个快速的编辑器不错，比VS本身打开方便多了。

其他语言方向的，如果之前用Sublime的，可能会比较多转到这个。如果这款编辑器微软真的比较重视的来发展、推广，支持插件化、语言独立配置之后，应该喜欢用Sublime来开发Python、Ruby、Go等等那批开发者都会切换到vscode。

如果说，你比较急切，上面的话都懒得看，那么我主要浓缩总结三点特性：

1. 免费

2. 用户体验细节好，IDE版的智能特性

3. 流畅，完全不卡。（Atom估计哭了，不知道微软为啥把自己改造的不卡了）

推出这个vscode对微软来说，就是标志着他们要开始席卷了，先让你们用上这种编辑器再说。当然对开发者来说，不管喜不喜欢用，反正不花钱多了一个选择，挺好的。

PS：话说到Atom，确实到现在我都没再用过。（经过评论指正）不过微软vscode好像是Atom Shell套层壳子，应该是自己改了，不知道怎么改的这么快，具体情况不敢乱下结论。不过不管怎么样，你好歹改下二进制文件的名字吧。。。