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版をダ
TypeScriptの世界を知る 前書き Node.jsエコシステムを体験しよう TypeScriptの書き方 変数 プリミティブ型 複合型 基本的な構文 基本的な型付け 関数 その他の組み込み型・関数 クラス 非同期処理 例外処理 TypeScriptの例外処理構文 Error クラス 標準の例外クラス 例外処理とコードの読みやすさ try 節はなるべく狭くする Error 以外を throw しない リカバリー処理の分岐のためにユーザー定義の例外クラスを作る 例外処理を使わないエラー処理 非同期と例外処理 例外とエラーの違い 例外処理のハンドリングの漏れ 例外処理機構以外で例外を扱う まとめ モジュール console.logによるログ出力 中級のテクニック ジェネリクス 関数型指向のプログラミング クラス上級編 リアクティブ 高度なテクニック 環境ごとのTips(共通環境・ブラウザ以
最近お仕事柄TypeScriptを触ることが増えてきました。LSPが整っているのでコードの定義の確認やコードジャンプなどは困っていなかったのですが、イイ感じにデバッグする環境が整っていないことに気づきました。 調べたところnvim-dap-vscode-js という素敵なプラグインを見つけたので、設定の流れをまとめておきます。 導入 READMEに沿ってインストールを進めます。私の環境では lazy.nvimを利用しているので、書き方を変えています。この辺りはお使いのパッケージマネージャーの書き方で読み替えてください。 { "mfussenegger/nvim-dap", dependencies = { "rcarriga/nvim-dap-ui", "theHamsta/nvim-dap-virtual-text", "mxsdev/nvim-dap-vscode-js", { "mi
JavaScriptにはJavaに似た例外処理の構文があります。例外にはErrorオブジェクトを使い、throw構文で例外を投げます。try-catch構文で例外を捕捉できます。
TypeScript is JavaScript with syntax for types.TypeScript is a strongly typed programming language that builds on JavaScript, giving you better tooling at any scale.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く