![「VS Code Server」が登場 ~VS Codeのバックエンドを単体CLIに、フロントエンドにはWeb版が使える/「Visual Studio Code」の2022年6月更新は新しいマージエディター、サイレントモードにも注目](https://cdn-ak-scissors.b.st-hatena.com/image/square/5b9fdeac77f749e1f99d48ed17d9427780cd12be/height=288;version=1;width=512/https%3A%2F%2Fforest.watch.impress.co.jp%2Fimg%2Fwf%2Flist%2F1423%2F348%2Fvisual_studio_code.jpg)
VSCode の更新情報を見ていたら Dev Container の仕様と、リファレンス実装の CLI ツールについて記載がありました。 Development Container specification Our development container teams across Microsoft and GitHub continue active development on the new Dev Container Specification, and this iteration had several exciting highlights. どういう風にやってきたのか Dev Container(devcontainer) の元は VSCode の Remote - Containers で使われている開発コンテナ(とその設定ファイル)のことです。これを VSCode
年々とelispのメンテが雑になってきて、ついにはemacsclientがemacs serverにうまく接続できなくなってしまい、とはいえ普通にスタンドアロンで立ち上げると動くのでログも取れずに原因究明が難しく、もはやこのままでは引退も近いかと思われたので、悪あがきでVSCodeに手を出してみることにした。 Perl Mongerの端くれとして、まずはPerlが書ける環境を整えようと、とりあえず最近ちょっと話題になっていたPerlNavigatorをVSCodeと共にインストールしてみた。 github.com ところがこいつがすごい。 シンタックスハイライトをいいかんじにやってくれるのはもちろんのこと、emacsではperldoc -lmした結果に飛べるelispを仕込んでおいた(たぶんid:sugyanさんあたりのelispから拝借したきがする)のを使っていたが、PerlNaviga
背景 プロジェクトの新規立ち上げや、新しくプロジェクトに新規メンバーが入った場合に環境構築に手間取ることが多いため、Docker+VS Code Remote Containersのフロントエンドアプリケーション開発環境構築ができるリポジトリを作成しました。 本記事では上記リポジトリを用いた環境構築手順とCreate React Appによる簡単なアプリ開発例を説明します。 また、上記リポジトリをgit cloneしなくても一から同じ環境を構築できるように、リポジトリに含まれるファイル群についてもそれぞれ説明します。 本記事の対象はフロントエンドですが、バックエンドのプロジェクト構築も基本的には同じ知識で構築できるはずです。 前提条件 本記事では以下を前提条件とします。ただし、WindowsやLinuxでも基本的には問題ないはずです。 macOS Monterey Visual Studi
このエントリははてなエンジニアAdvent Calendar 2021の10日目の記事です。今回はVisual Studio Code向けの拡張を作った話を書きます。 拡張の様子 はてな記法そこそこ使っている 自分ははてな社員というのもあり、自社のサービスをちゃんと使っておきたいという気持ちで個人ブログもはてな記法モードで書いています。 ただ普段コード書くときはVS Codeで書いており、VS Codeは現状はてな記法で書かれた文章は認識してくれないので、中々手元で書くモチベーションがあがらない。 また、VS Code拡張作ってる人々が周辺にいたので自分も作ってみたいかもと数日前に突如思い立ちました。 ということで作った 作りました。いますぐインストールしましょう。 marketplace.visualstudio.com ソースコードはこちらです。 github.com 見どころ 見どこ
Register now for a full day of community, learning, and all things Visual Studio Code vscode.dev(!) October 20, 2021 by Chris Dias, @chrisdias Back in 2019, when the .dev top-level domain opened, we picked up vscode.dev and quickly parked it, pointing at our website code.visualstudio.com (or, if you are from the Boston area like me, we "pahked it"). Like a lot of people who buy a .dev domain, we h
Version 1.85 is now available! Read about the new features and fixes from November. As you have seen in the Programmatic Language Features topic, it's possible to implement Language Features by directly using languages.* API. Language Server Extension, however, provides an alternative way of implementing such language support. This topic: Explains the benefits of Language Server Extension. Walks y
はじめに なぜ遅いのか 何をやるのか 計測 名前付きボリュームを使ってない場合 Named Volumeを使う場合 Macからどう見えているか 結論とまとめ はじめに 以前からいろんなところで話していますが、僕は普段、手元のMacには言語系のランタイムとかは入れておらずVS CodeとDocker for Macだけ入れてRemote Containersの環境で開発しています。 この環境自体はとても便利でいいのですが、一点大きな問題があります。 それは遅いということ。自分の場合は最近だとJSでの開発が多いのですが、例えばNext.jsで開発している場合に以下のような操作が特に遅く感じます。 yarn install yarn add yarn jest next dev next start next build yarn jestとかnext devが遅いのは起動だけだったりします。起
Version 1.89 is now available! Read about the new features and fixes from April. October 2020 (version 1.51) Update 1.51.1: The update addresses these issues. Downloads: Windows: x64 Arm64 | Mac: Intel | Linux: deb rpm tarball Arm snap Welcome to the October 2020 release of Visual Studio Code. As announced in the October iteration plan, we focused on housekeeping GitHub issues and pull requests as
VSCodeでFindしている時に、マッチしているwordは背景色が変わって分かるのだけど、今どこにフォーカスしているかが分かりづらかった。これが特に問題が起こるのがReplaceをしようとしている時で、Replaceするたびに今どこ?とマッチ箇所を探していた。これだと時間がかかって困る。 調べてみるとTheme Color | Visual Studio Code Extension APIに書かれているように、自分のsettings.json内で自分用に色を調整し、見やすくカスタマイズ出来ることが分かった。これでFindの現在のマッチ箇所を見やすくしてみる。 Findの色のカスタマイズは editor.findMatchBackground: Color of the current search match. editor.findMatchHighlightBackground:
https://marketplace.visualstudio.com/items?itemName=shibayu36.open-to-other-editor-group こういう拡張を作ったので紹介。 困っていたこと VSCodeで開発している時に、今書いているコードの参考にするため別のファイルを開こうと思ったり、今の実装のテストファイルを開こうと思ったりすることがある。こういう時には毎回以下のどちらかを行っていた。 別のEditor Groupにフォーカスを移して「Go to File...」を実行 Explorer Viewにフォーカスを移してファイルを開いた後、別のEditor Groupでもう一度今見ていたファイルを開き直す これがめちゃくちゃ面倒だった。 Explorer Viewには「Open to the Side」というメニューコマンドもあるのだけど、これは一番端の
こんにちは、弥生のMisoca開発チームの黒曜(@kokuyouwind)です。 Kaigi on Railsの登壇が決まったのでよろしくおねがいします。弥生社員としては初登壇になります。 「おめでとうございます。 選考の結果、あなたのプロポーザルは採択されました!」 とのことなので、Kaigi on Railsお話しにいきますー— 黒曜 (@kokuyouwind) August 25, 2020 前回の記事が濃厚だったため、今回はライトなTips記事です。よろしくおねがいします。 tech.misoca.jp 👯♀️ VSCode LiveShareを使ったリモートペアプログラミング 皆さん、ペア作業してますか? ペアプログラミングはドライバー・オペレータの交代など具体的なノウハウも多く、このブログでも以前に紹介記事を書きました。 tech.misoca.jp 上記の記事ではリモー
VSCodeで長いコードや入り組んだコードを読んでいくときに、さっき読んでたあれはどこに行ったっけ、となって困っていた。ファイル名を手元のテキストファイルにメモしたりしていたけど、ところでさきほどのメモのタブはどこにいったのか…と混乱していた。 エディタ内にブックマークを作れる拡張があるに違いない、と探したらBookmarksという拡張があった。 その名の通りで、行に対してブックマークを追加できる。サイドバーのBookmarksタブからブックマーク一覧を参照できる。 ここのテストは後で直しそうだな、と思ったらとりあえずブックマークしておく、みたいに使えて便利。 marketplace.visualstudio.com 追記 コメントで偽物の拡張があると教えてもらった。たしかにインストール数が100くらいの同名の拡張がありました。どのような挙動をするかは分かっていません。GitHubのリポジ
VSCode の拡張機能をつくる練習として、開いているワークスペースの Git の情報から、 GitHub のパーマリンクをクリップボードにコピーする拡張機能を作った。練習なので壊れているかもだけどよければお使いください。 marketplace.visualstudio.com remote (origin) の URL 、 HEAD のハッシュ、開いているファイル名、カーソル行の行番号をくっつけた、 https://github.com/hogashi/sketch-20200411-vscode-ext-git/blob/47b96dd6cc7c521d9ab017ce7760d62536cbb4cc/src/extension.ts#L4 みたいな URL をクリップボードに入れる。選択範囲で見ているので、複数行選択しているときはその範囲の URL になる ( https://gi
Visual Studio Codeの代替を狙う統合開発環境「Eclipse Theia 1.0」リリース。VS Codeの拡張機能を利用可能、デスクトップ版とWebブラウザ版に両対応 Eclipse Foundationは、オープンソースで開発されている統合開発環境「Eclipse Theia 1.0」のリリースを発表しました。 Eclipse Theiaは、「真のオープンソースによるVisual Studio Codeの代替」(a true open source alternative to Microsoft’s popular Visual Studio Code (VS Code) software)だとEclipse Foundationは紹介しており、デスクトップアプリケーションだけでなくWebブラウザからも同一機能が利用できるWebアプリケーション版も提供されています。
年末年始の時間を使って実験していたこと。 tl;dr vscode をカスタマイズして静的サイトとしてデプロイしたい。やった。公式にない永続化層も作った。 できた。ここで試せる。 https://mizchi-vscode-playground.netlify.com/ やりたかったこと フロントエンドにまつわるものはフロントエンドで作業を完結したい。なので vscode がブラウザで動いてほしい。 vscode をカスタマイズしたものを各自が自由にデプロイできると、様々な可能性がある。インストールの手間を省いたプログラミング教育用のツールだったり、専用の開発環境だったり、その他諸々。 問題 この用途で期待していた vscode online が使いづらかった。MS のアカウントを要求されたり、Docker コンテナの Enviroment を作ったりする必要があり、面倒だった。そもそもリ
Perlでモジュールを書くとたいてい先頭に package Hoge::Fuga::Piyo::Payo; のような宣言を書くことになると思います*1。 最初のうちはいいけど、名前空間がだんだん複雑になっていくと、これは単に写してるだけでは?? となってきます。 ところで、ファイルパスからパッケージ名への変換は、たいていの場合すごく素朴に行えるのではないでしょうか。 先頭の lib/ を消す 拡張子の .pm を消す / を :: に変換する ということでそれをコマンド1つで実行してカーソルの位置に挿入してくれる拡張機能を作って出しました。ご活用お待ちしております。 marketplace.visualstudio.com 利用方法は以下の動画が全てを物語っています。 2019/10/29追記: このたび、コマンドだけでなく補完にも対応しました。よりストレスフリーにパッケージ宣言ができるよ
Review and manage your GitHub pull requests and issues directly in VS Code This extension allows you to review and manage GitHub pull requests and issues in Visual Studio Code. The support includes: Authenticating and connecting VS Code to GitHub and GitHub Enterprise. Listing and browsing PRs from within VS Code. Reviewing PRs from within VS Code with in-editor commenting. Validating PRs from wit
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く