node でさっくりと TypeScript を実行したいときに、babel なり webpack なりで transpile して実行するのは不便です。しかも型が考慮されなくなってしまいますね。 そういうときは ts-node を使うことで、バベってファイルを生成してから食わせずとも、そのまま実行できるので手軽です。型も考慮されます。 使い方 さっくりと依存を追加します:
![ts-node で TypeScript + node をサクッと実行する - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/00a9e4bf7f537495e326ce925a5917af1dd8f57b/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9dHMtbm9kZSUyMCVFMyU4MSVBNyUyMFR5cGVTY3JpcHQlMjAlMkIlMjBub2RlJTIwJUUzJTgyJTkyJUUzJTgyJUI1JUUzJTgyJUFGJUUzJTgzJTgzJUUzJTgxJUE4JUU1JUFFJTlGJUU4JUExJThDJUUzJTgxJTk5JUUzJTgyJThCJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz01ODI0Njk5NTQzZmVhMzUxZGVkZmIwMDIyMjU4NTIzOQ%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBtYW5nYW5vLWl0byZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9MmRlYWIyYTM1MWQ1YzJmMzNjYWE4ZDc3NzI1ODRhNWQ%26blend-x%3D142%26blend-y%3D436%26blend-mode%3Dnormal%26txt64%3DaW4g44Gv44Gm44Gq%26txt-width%3D770%26txt-clip%3Dend%252Cellipsis%26txt-color%3D%2523212121%26txt-font%3DHiragino%2520Sans%2520W6%26txt-size%3D36%26txt-x%3D156%26txt-y%3D536%26s%3Df4079ac6ffdecf1b5b1f366a36aa55f4)
node でさっくりと TypeScript を実行したいときに、babel なり webpack なりで transpile して実行するのは不便です。しかも型が考慮されなくなってしまいますね。 そういうときは ts-node を使うことで、バベってファイルを生成してから食わせずとも、そのまま実行できるので手軽です。型も考慮されます。 使い方 さっくりと依存を追加します:
概要 Typescriptのデバッグを体験する。 コードはこちら 各種ファイルの役割等を調べたので共有。 .vscode/launch.jsonを作成 { "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Launch TypeScript", "preLaunchTask": "Compile TypeScript", "cwd": "${workspaceFolder}", "program": "${file}" } ] } launch.jsonとは VSCodeでデバッグ実行するための設定ファイル 作業ディレクトリの.vscodeディレクトリ配下に作成する 公式ドキュメント 各種パラメータ version 不明 configurations type 起動
中間ファイルを生成するタスクをなるべく飛ばしたい人向け Tweet 2021年8月4日 嶋田大貴 node.jsでTypeScriptを実行するにはTypeScriptを JavaScriptにトランスパイルする必要があるが、ts-node というツールを使用するとトランスパイルと実行をひとまとめで行ってくれる。 VS Codeから TypeScriptをデバッグ実行するときも基本的には トラインスパイルを行うための preLaunchTask を定義するような方法が公式で示されているが、まどろっこしいのでそこも ts-nodeを使って処理を省略したいよね、という場合、 { "configurations": [ { "name": "Launch TypeScript Using ts-node", "type": "node", "request": "launch", "skipFi
変更履歴 2021/06/19: エディタで開いている(アクティブな).tsファイルをデバッグするように変更(デバッグ設定ファイルを書き換える必要がなくなりました) できること ts-nodeを使い、開いている.tsファイルを コンパイルすことなく デバッグする もしくは、ts-nodeで実行中のスクリプトにアタッチしてデバッグする 経緯 ts-nodeを利用した場合のデバッグ方法がよくわからなかったため、調べた結果をまとめました。 ※typescriptをtscでトランスパイルしてからデバッグする場合tsconfig.jsonでmapファイルの設定が必要です(.ts, .jsで互いの行位置を認識しないとブレークポイントを張ったり、行ステップ実行ができない。) 一方、ts-nodeはtsconfig.jsonでmapファイルの指定をしない(デフォルトのまま)でもデバッグできるようです(公式
VSCode から TypeScript のコードを tsc でコンパイルせず直接実行したい場合は、node の実行時引数から ts-node を使うように launch.json の設定を書けばいい。 https://github.com/TypeStrong/ts-node#visual-studio-code { "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Launch Program", "runtimeArgs": ["-r", "ts-node/register"], "args": ["${file}"] } ] } Firebase Functions を扱うリポジトリでは、package.json が functions/ ディレクトリ下に入
こちらの記事で解説しているfunctions-emulatorは既に Deprecated になっており困ってしまったので覚書を残しておきます。 デバッグツール Visual Studio Code firebase-tools tsconfig.jsonの作成 TypeScriptで開発している場合は、tsconfig.jsonのsourceMapをtrueにしておきます。 { "compilerOptions": { "module": "commonjs", "outDir": "lib", "sourceMap": true, "strict": true, "target": "es6" }, "compileOnSave": true, "include": [ "src" ] } launch.jsonの作成 .vscode/launch.jsonを作成します。ポイントはou
VSCodeのインストール ・VScodeはMicrosoftが開発している無償のコードエディタ。Visual Studio Code。 ・Windowsはもちろん、MacOSやLinuxにも対応。 ・拡張機能により様々な機能の追加ができる。 ・Git連携も可能。 ・IDEのように動作し、デバッグ機能などもある。 入手先 インストール デフォルト設定で問題ないが ・エクスプローラーのファイルコンテキストメニューに[Codeで開く]アクションを追加する ・エクスプローラーのディレクトリコンテキストメニューに[Codeで開く]アクションを追加する にチェックをいれておくとより良い。 Node.jsのインストール React開発上でnpm(Node Package Manager)は必須。 npmを使用するためにはNode.jsをインストール必要がある。 入手先 初心者は何も考えずにLTS版をダ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く