{"id":10006847,"date":"2022-11-17T00:01:00","date_gmt":"2022-11-16T16:01:00","guid":{"rendered":"https:\/\/ityet.com\/?p=10006847"},"modified":"2022-11-17T00:01:00","modified_gmt":"2022-11-16T16:01:00","slug":"vs-code-for-web-%e6%b7%b1%e5%85%a5%e6%b5%85%e5%87%ba-%e8%bf%9b%e7%a8%8b%e9%97%b4%e9%80%9a%e4%bf%a1%e7%af%87","status":"publish","type":"post","link":"https:\/\/itmax.cn\/?p=10006847","title":{"rendered":"VS Code For Web \u6df1\u5165\u6d45\u51fa &#8212; \u8fdb\u7a0b\u95f4\u901a\u4fe1\u7bc7"},"content":{"rendered":"<p>\u5728\u4e0a\u4e00\u7bc7\u4e2d\uff0c\u6211\u4eec\u4e00\u8d77\u5206\u6790\u4e86 VS Code \u6574\u4f53\u7684\u4ee3\u7801\u67b6\u6784\uff0c\u4e86\u89e3\u4e86 VS Code \u662f\u7531\u524d\u540e\u7aef\u5206\u79bb\u7684\u65b9\u5f0f\u5f00\u53d1\u7684\u3002\u4e14\u65e0\u8bba\u524d\u7aef\u662f\u57fa\u4e8e electron \u8fd8\u662f web\uff0c\u540e\u7aef\u662f\u672c\u5730\u8fd8\u662f\u4e91\u7aef\uff0c\u5176\u8c03\u7528\u65b9\u5f0f\u5e76\u65e0\u4e0d\u540c\u3002<\/p>\n<p>\u8fd9\u6837\u7684\u67b6\u6784\u4e0b\uff0c\u524d\u540e\u7aef\u7684\u901a\u4fe1\u65b9\u5f0f\u662f\u5982\u4f55\u5b9e\u73b0\u7684\u5462\uff1f\u672c\u7bc7\u6211\u4eec\u5c06\u4e00\u8d77\u6765\u63a2\u7a76 VS Code For Web \u7684\u8fdb\u7a0b\u95f4\u901a\u4fe1\u65b9\u5f0f\u3002<\/p>\n<h2>\u8fdb\u7a0b\u901a\u4fe1\u4e0e\u8c03\u7528\u65b9\u5f0f<\/h2>\n<h3>\u8fdb\u7a0b\u95f4\u901a\u4fe1\u534f\u8bae<\/h3>\n<p>\u5bf9\u4e8e\u591a\u8fdb\u7a0b\u67b6\u6784\u7684\u9879\u76ee\uff0c\u8fdb\u7a0b\u4e4b\u95f4\u7684\u901a\u4fe1\u4f1a\u901a\u8fc7\u8fdb\u7a0b\u95f4\u8c03\u7528 (Inter Process Calling, IPC)\u3002VSCode \u4e2d\u81ea\u5df1\u8bbe\u8ba1\u4e86\u4e13\u95e8\u7684 IPC \u6a21\u5757\u6765\u5b9e\u73b0\u901a\u4fe1\u3002\u4ee3\u7801\u4f4d\u4e8e <a href=\"https:\/\/link.segmentfault.com\/?enc=2Os86KSIpCq%2BJvDHs62MPA%3D%3D.vk7wRBJ7bl2RMDObdsz41ttUnbyYrHg%2BO6zGQlngRsHULvVGZJQ%2FYvdPm4egptnTZAS9TSq101KWoLLoj2L4Ip5OkuYfUE5dfBR04sZ3BeA%3D\" rel=\"nofollow\">src\/vs\/base\/parts\/ipc<\/a>\u3002<\/p>\n<pre><code class=\"ts\">export const enum RequestType {\n    Promise = 100,\n    PromiseCancel = 101,\n    EventListen = 102,\n    EventDispose = 103\n}<\/code><\/pre>\n<p>\u4ece enum type \u53ef\u4ee5\u770b\u51fa\uff0cVSCode \u7684 IPC \u6a21\u5757\u540c\u65f6\u652f\u6301\u4e24\u79cd\u8c03\u7528\u65b9\u5f0f\uff0c\u4e00\u79cd\u662f\u57fa\u4e8e Promise \u7684\u8c03\u7528\u5b9e\u73b0\uff0c \u53e6\u4e00\u79cd\u662f\u901a\u8fc7 Event Emitter\/Listener \u7684\u90a3\u4e00\u5957\u4e8b\u4ef6\u76d1\u542c\u673a\u5236\u6765\u5b9e\u73b0\u3002<\/p>\n<p>\u4ee5\u4e8b\u4ef6\u76d1\u542c\u673a\u5236\u4e3a\u4f8b\uff0cVSCode \u4e2d\u91c7\u7528 <code>vscode-jsonrpc<\/code> \u8fd9\u4e2a\u5305\u6765\u5c01\u88c5\u5b9e\u73b0\uff0c\u8c03\u7528\u65b9\u5f0f\u5982\u4e0b\uff1a<\/p>\n<pre><code class=\"ts\">import * as cp from 'child_process';\nimport * as rpc from 'vscode-jsonrpc\/node';\n\nlet childProcess = cp.spawn(...);\n\n\/\/ Use stdin and stdout for communication:\nlet connection = rpc.createMessageConnection(\n    new rpc.StreamMessageReader(childProcess.stdout),\n    new rpc.StreamMessageWriter(childProcess.stdin));\n\nlet notification = new rpc.NotificationType&lt;string, void&gt;('testNotification');\n\nconnection.listen();\n\nconnection.sendNotification(notification, 'Hello World');<\/code><\/pre>\n<p>\u670d\u52a1\u7aef\u8c03\u7528\u4e5f\u91c7\u7528\u7c7b\u4f3c\u7684\u5305\u88c5\uff1a<\/p>\n<pre><code class=\"ts\">import * as rpc from 'vscode-jsonrpc\/node';\n\nlet connection = rpc.createMessageConnection(\n    new rpc.StreamMessageReader(process.stdin),\n    new rpc.StreamMessageWriter(process.stdout));\n\nlet notification = new rpc.NotificationType&lt;string, void&gt;('testNotification');\nconnection.onNotification(notification, (param: string) =&gt; {\n    console.log(param); \/\/ This prints Hello World\n});\n\nconnection.listen();<\/code><\/pre>\n<h3>\u8fdb\u7a0b\u95f4\u901a\u4fe1\u5355\u5143<\/h3>\n<p>\u4e3a\u4e86\u5b9e\u73b0\u5ba2\u6237\u7aef\u4e0e\u670d\u52a1\u7aef\u4e4b\u95f4\u7684\u70b9\u5bf9\u70b9\u901a\u4fe1\uff0c\u6211\u4eec\u9700\u8981\u4e00\u4e2a\u6700\u5c0f\u5355\u5143\u6765\u5b9e\u73b0\u6d88\u606f\u7684\u8c03\u7528\u4e0e\u76d1\u542c\u3002\u5728 VSCode \u4e2d\uff0c\u8fd9\u4e2a\u6700\u5c0f\u5355\u5143\u5373\u4e3a <code>Channel<\/code>\u3002<\/p>\n<pre><code class=\"ts\">\/**\n * An `IChannel` is an abstraction over a collection of commands.\n * You can `call` several commands on a channel, each taking at\n * most one single argument. A `call` always returns a promise\n * with at most one single return value.\n *\/\nexport interface IChannel {\n    call&lt;T&gt;(command: string, arg?: any, cancellationToken?: CancellationToken): Promise&lt;T&gt;;\n    listen&lt;T&gt;(event: string, arg?: any): Event&lt;T&gt;;\n}<\/code><\/pre>\n<p>\u6bcf\u6b21\u901a\u4fe1\u8fc7\u7a0b\uff0c\u9700\u8981\u5ba2\u6237\u7aef\u4e0e\u670d\u52a1\u7aef\u5904\u4e8e\u540c\u4e00\u4e2a <code>Channel<\/code> \u4e2d\u3002<\/p>\n<h3>\u8fdb\u7a0b\u95f4\u901a\u4fe1\u5efa\u8fde<\/h3>\n<p>\u5728 VSCode \u4e2d\uff0c\u5ba2\u6237\u7aef\u4e0e\u670d\u52a1\u7aef\u4e4b\u95f4\u7684\u901a\u4fe1\u5efa\u7acb\u662f\u901a\u8fc7 <code>Connection<\/code> \u7c7b\u6765\u5efa\u7acb\uff0c\u901a\u8fc7\u4f20\u5165\u5ba2\u6237\u7aef\u4e0e\u670d\u52a1\u7aef\u7684 <code>Channel<\/code> \uff0c\u5373 <code>ChannelClient<\/code> \u4e0e <code>ChannelServer<\/code> \u6765\u5b9e\u4f8b\u5316\u8fde\u63a5\u3002<\/p>\n<pre><code class=\"ts\">interface Connection&lt;TContext&gt; extends Client&lt;TContext&gt; {\n    readonly channelServer: ChannelServer&lt;TContext&gt;;\n    readonly channelClient: ChannelClient;\n}<\/code><\/pre>\n<p>\u5b83\u4eec\u4e4b\u95f4\u7684\u533a\u522b\u662f\uff0c\u7531\u4e8e\u670d\u52a1\u7aef\u53ef\u4ee5\u540c\u65f6\u5bf9\u591a\u4e2a\u5ba2\u6237\u7aef\u670d\u52a1\uff0c\u56e0\u6b64\u652f\u6301\u591a\u4e2a <code>Channel<\/code> \u7684\u83b7\u53d6\uff0c\u800c<code>ChannelClient<\/code> \u4e3a\u4e00\u5bf9\u4e00\u8fde\u63a5\u3002<\/p>\n<p>\u7efc\u4e0a\uff0c\u6211\u4eec\u5c31\u68b3\u7406\u6e05\u695a\u4e86 VSCode \u4e2d IPC \u6a21\u5757\u7684\u57fa\u672c\u67b6\u6784\uff0c\u4e86\u89e3\u4e86\u8fdb\u7a0b\u95f4\u7684\u901a\u4fe1\u7ec6\u8282\u3002<\/p>\n<p>\u7528\u4e00\u5f20\u56fe\u603b\u7ed3\u68b3\u7406\u4e00\u4e0b\u77e5\u8bc6\u70b9\uff1a<\/p>\n<p><img decoding=\"async\" referrerpolicy=\"no-referrer\" src=\"https:\/\/segmentfault.com\/img\/bVc28os\" alt=\"20221010150243\" title=\"20221010150243\" loading=\"lazy\"><\/p>\n<p>\u7531\u4e8e VSCode \u7684 IPC \u6a21\u5757\u5929\u7136\u652f\u6301\u5f02\u6b65\u80fd\u529b\uff0c\u56e0\u6b64\u4e8b\u5b9e\u4e0a\u5b83\u5e76\u4e0d\u533a\u5206\u8fdb\u7a0b\u662f\u672c\u5730\u8fdb\u7a0b\u8fd8\u662f\u8fdc\u7aef\u8fdb\u7a0b\uff0c\u53ea\u8981\u662f\u901a\u8fc7 <code>Channel<\/code> \u901a\u4fe1\u7684\uff0c\u90fd\u53ef\u4ee5\u88ab\u8ba4\u4e3a\u662f\u8fdb\u7a0b\u95f4\u901a\u4fe1\uff0c\u90fd\u53ef\u4ee5\u590d\u7528\u76f8\u540c\u7684\u4ee3\u7801\u7f16\u5199\u3002<\/p>\n<h2>\u53c2\u8003<\/h2>\n<p><a href=\"https:\/\/link.segmentfault.com\/?enc=H5Qy7ZLcH%2FcSxaJphfKxbw%3D%3D.3HTwDNkzXNIGZC7juHrLuMzktryLnswOHpns4ivopU61nzb0vcdqlhWCoL9WcWxn%2B%2BhHbPMwF6wZ16iRoUYjyeW3%2FGt9cnu0vg%2Fzu5AdsEY%3D\" rel=\"nofollow\">VSCode \u7684\u5b98\u65b9\u6587\u6863<\/a><\/p>\n<p><a href=\"https:\/\/link.segmentfault.com\/?enc=xfYVeZzIGqw2G%2BBHbxmVQg%3D%3D.JGlGnHQigbI2f3lYA81bukNRFTjaqQgzHnPhLNx3vPeNlHOBE4aZBmm%2FwDMZtBJk6sVtiaOnapBiLqU9xTdbX64mln3c0Y3g6ECQ0JNPivJhx2MALMlcCTuK6E5rgPa2\" rel=\"nofollow\">VSCode API<\/a><\/p>\n<p><a href=\"https:\/\/link.segmentfault.com\/?enc=3hVsyvVLlqwqWFHsdUlDdw%3D%3D.MFfMAfA2LLZU7fX5M1MEXe9RELJvb3bEi%2F%2F0Ol0cvH%2B45DSTuCUfCnlz%2Bi%2BAk7CE\" rel=\"nofollow\">VSCode \u6e90\u7801\u89e3\u8bfb&#8211;IPC \u901a\u4fe1\u673a\u5236<\/a><\/p>\n<p><a href=\"https:\/\/link.segmentfault.com\/?enc=3O4sELZcL%2BSbvZrGHRE9dg%3D%3D.%2BBpypogH9EY%2B%2F0wt8ql4FQgK9l0vZ4F6wIs2i%2BYSzH6F7JpG5muoj4qUiV%2BJfAsJ\" rel=\"nofollow\">vscode \u6e90\u7801\u89e3\u6790 &#8211; \u8fdb\u7a0b\u95f4\u8c03\u7528<\/a><\/p>\n<p><a href=\"https:\/\/segmentfault.com\/a\/1190000042653911\">https:\/\/segmentfault.com\/a\/1190000042653911<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u5728\u4e0a\u4e00\u7bc7\u4e2d\uff0c\u6211\u4eec\u4e00\u8d77\u5206\u6790\u4e86 VS Code \u6574\u4f53\u7684\u4ee3\u7801\u67b6\u6784\uff0c\u4e86\u89e3\u4e86 VS Code \u662f\u7531\u524d\u540e\u7aef\u5206\u79bb\u7684\u65b9\u5f0f\u5f00\u53d1\u7684 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[4],"tags":[],"class_list":["post-10006847","post","type-post","status-publish","format-standard","hentry","category-share"],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/itmax.cn\/index.php?rest_route=\/wp\/v2\/posts\/10006847","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/itmax.cn\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/itmax.cn\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/itmax.cn\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/itmax.cn\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=10006847"}],"version-history":[{"count":0,"href":"https:\/\/itmax.cn\/index.php?rest_route=\/wp\/v2\/posts\/10006847\/revisions"}],"wp:attachment":[{"href":"https:\/\/itmax.cn\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=10006847"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/itmax.cn\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=10006847"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/itmax.cn\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=10006847"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}