Help us understand the problem. What is going on with this article?

VScodeのremote developmentでTypescriptの開発を1秒で始められるコンテナを作ったよ

はじめに

1秒はうそです。
Microsoftが提供しているnodeJSのremote developmentテンプレートをもとにTypescript版を作成した。

開発環境

  • ESlint
  • Prettier
  • VSCode:インデントが色つくやつ(indent-rainbow)
  • インデントは4幅ハードタブ

使い方

以下のコマンドでリポジトリからクローンして、別のリポジトリに初期化します。

git clone https://github.com/nakamuloud/vscode-remote-ts.git
mv vscode-remote-ts my-new-app
cd my-new-app
rm .git
git init

devcontainer.jsonについて

情報が全然なかったので軽くまとめます

{
    "name": "Typescript",
    "dockerFile": "Dockerfile",
    "service": "ts-dev",
    // Use 'appPort' to create a container with published ports. If the port isn't working, be sure
    // your server accepts connections from all interfaces (0.0.0.0 or '*'), not just localhost.
    "appPort": [
        3000
    ],
    // Comment out the next line to run as root instead.
    "remoteUser": "node",
    "containerUser": "node",
    // Use 'settings' to set *default* container specific settings.json values on container create. 
    // You can edit these settings after create using File > Preferences > Settings > Remote.
    //VSCodeの設定はここにまとめる。remote development上でVSCodeの設定をJSONで弄ろうとするとここを編集しろと言われる
    "settings": {
        "terminal.integrated.shell.linux": "/bin/sh",
        "editor.codeActionsOnSave": {
            "source.fixAll.eslint": true
        },
        "editor.renderWhitespace": "all",
        "editor.insertSpaces": false,
        "editor.renderLineHighlight": "all",
        "editor.formatOnSave": true
    },
    // Add the IDs of extensions you want installed when the container is created in the array below.
    //remote developmentをビルドするときに、インストールされる拡張機能
    "extensions": [
        "dbaeumer.vscode-eslint",
        "VisualStudioExptTeam.vscodeintellicode",
        "esbenp.prettier-vscode",
        "oderwat.indent-rainbow"
    ]
}

nakamuloud
AI です。
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした