とりあえず、とりあえず： JSX構文は、HTMLに近いが違うマークアップ言語だと思えば（割り切れば）いい。 テンプレート変数〈プレースホルダー〉は { } 構文。テンプレート構文としては視認性が落ちるが、まーしゃーない。MDXでもエスケープはブレイスだけ。…

TypeScriptで宣言空間という独特の言葉を使う。「名前空間」と呼ばない理由は： 「名前空間」はファイルとは別なモジュールを意味するので、コンフリクトを避けた。 名前の容れ物というより、名前の分類基準に近い。 宣言された名前がどの種別かは： 変数名…

CommonJS方式 exports と module.exports - (新) 檜山正幸のキマイラ飼育記 メモ編 の続き。CJSエクスポートのエミュレート - (新) 檜山正幸のキマイラ飼育記 メモ編 とも関係する。https://jovi0608.hatenablog.com/entry/20111226/1324879536 に書いてある…

順不同に色々。パッケージ： パッケージ名は名前空間付きにできて @foo/bar のように書ける。従来のフラットな名前 foo もある。 パッケージ名は原則物理的ディレクトリ名だが、./package.json で指定した名前が正式名。 パッケージのエントリーポイントファ…

CommonJS方式 exports と module.exports - (新) 檜山正幸のキマイラ飼育記 メモ編 の話。 let mod = {}; mod.exports = {}; (function (module, exports){ exports = "hello"; // 好きなコード })(mod, mod.exports); console.dir(mod.exports); これで挙動…

名前列挙したエクスポート文は、ファイルの先頭でも最後でもいいが、ファイルの先頭を推奨。最後だと、そこにあるのを見過ごす可能性があるし、長いファイルをスクロールする手間もイヤだ。メタ的情報は先頭に書け。 import * as say from './say.js'; ↑だと…

index.js, index.ts とかでメインエントリーポイントを指定する習慣があるが、これはやめたい。 ファイル名だけでは何をするものか想像ができない。ディレクトリ名／プロジェクト名の情報が別に必要。 コピーして上書きする危険がある。 パッケージ／ディレ…

export default function foo() { console.log("hello"); } 次のようにコンパイルされる。 "use strict"; exports.__esModule = true; function foo() { console.log("hello"); } exports["default"] = foo; exports["default"] は、mudule.exports.default …

まず、「package.json の imports / exports フィールド」については、 https://shisama.hatenablog.com/entry/2020/12/21/090000 TyepScriptの設定でもモジュール名マップ〈エイリアス〉ができるらしい。使っている例が次にあるが、オーバーキルしてるよう…

esbuild関係。https://qiita.com/rkamikawa/items/7c6210fc97aaf8878536 から： ビルドツールには、esbuild の他に、Webpack、Gulp、Parcel、Rollup、Browserify、FuseBox などがあります。 はっ？ ビルドツールって？？ JIT コンパイルを使用するため、速度…

npm version 8.12.2 の挙動が変なんでダウングレードした。これは、バージョン指定してインストール。 > npm -v npm WARN logfile could not be created: TypeError: fs.withOwnerSync is not a function 8.12.2 > npm install npm@8.12.0 --global npm WARN…

TypeScriptのテスト の続き。次をインストールする。 グローバルに esbuild ローカルに esbuild-jest ローカルに @types/jest jestの設定をする。例えば、package.json に書く。 "jest": { "verbose": true, "transform": { "\\.ts$": "esbuild-jest" } }, …

特にグローバルインストールを調べる。 古いパッケージを調べる npm outdate {-g | --global}? 脆弱性があるパッケージを確認する npm audit 、グローバルはチェックできない。 新しいバージョンに更新する npm update XXX {-g | --global}? npm install npm…

npmをアップデートしたら動かなくなった。エラーは TypeError: cleanUrl is not a functioncleanUrlを呼ぼうとして無いというもの。fixするには、 ~\AppData\Roaming\npm\node_modules\npm\node_modules\npm-registry-fetch\lib\index.js の最後に module.ex…

TypeScriptプロジェクトの始め方 - (新) 檜山正幸のキマイラ飼育記 メモ編 TypeScriptプロジェクトを始めたら - (新) 檜山正幸のキマイラ飼育記 メモ編 再度、素のディレクトリから始めたら - (新) 檜山正幸のキマイラ飼育記 メモ編 まだハマっている所←わか…

サラからの最低限環境構築を試していたが、最低限でもテストは必要。でjestは入れてみた。https://jestjs.io/ja/docs/cli により使う。jestのテストコードはそれ自身がDSLみたいなものだから、JavaScript構文で書いてもいいと思うが、テストコード自体をType…

実際は引数を渡せるが、引数なしと違う挙動をしてしまう。 まだハマっている所←わかった - (新) 檜山正幸のキマイラ飼育記 メモ編 tsc だけで起動するのが基本的な使い方となる。なぜ？ tsc は tsconfig.json の files を見てコンパイルすべきファイルを決め…

esbuildってやつがある。型チェックをしないが高速。esbuildの補助ツールに： esbuild-register https://github.com/egoist/esbuild-register esbuild-node-tsc https://github.com/a7ul/esbuild-node-tsc esbuild-registerがnode-tsコマンドの代替、esbuild…

素のディレクトリでまだハマっている所がある。サンプルコードは var map:Map<number, string>; map = new Map<number, string>(); map.set(3, "hello"); console.log(map.get(3)); map.set(5, "world"); console.log(map.get(5)); for (let [key, val] of map) { console.log(`${key} = ${va</number,></number,>…

TypeScriptプロジェクトを始めたら ： もう一度サラからやってみるか。 サラからやった記録。 TmpTsDev > which tsc C:\Users\m-hiyama\AppData\Roaming\npm\tsc.ps1 TmpTsDev > tsc --version Version 4.6.2 ディレクトリを作る。 map.ts を作る。 グローバ…

「TypeScriptプロジェクトの始め方」の続き。素のディレクトリからデフォルト設定で始めるとけっこう色々ハマる。とりあえず次がコンパイルできない。 var map:Map<number, string>; map = new Map<number, string>(); map.set(3, "hello"); console.log(map.get(3)); 次はnode.jsで直接実行</number,></number,>…

JavaScriptの module.exports と exports の挙動を説明する言葉を探していたら： https://qiita.com/raccy/items/d4c5e7995a8fc90109ee ↑概念と用語法としては正しい指摘だと思うが、「参照渡し」はすでに「アドレス渡し」の意味で通用してしまっているから…

TypeScriptで、CommonJS設定なら export = fooFun; は使える。module.exports = fooFun; にコンパイルされる。 JavaScriptの exports 変数 JavaScriptの module.exports プロパティ TypeScriptの export 変数 TypeScriptの export キーワード これはハマるだ…

https://typescriptbook.jp/reference/import-export-require ： モジュールは、importまたはexportを1つ以上含むJavaScriptファイルを言います。 TypeScriptはそうなんだろうが、分かりにくいな。スクリプト／モジュール判定法は、2つに分ける。 内的判定：…

CommonJS方式は、言語仕様ではなくて、JavaScript言語処理系実装が提供する機能に過ぎない（標準化されてるとしても）。この機能の主要な構成素は： モジュールコード実行中には require として見える NativeModule.require関数 モジュールコード実行中には …

古い記事だが、https://jovi0608.hatenablog.com/entry/20111226/1324879536 に、node.jsソースの一部が載っていた。 src/node.js(v0.6.6) 526 NativeModule.wrap = function(script) { 527 return NativeModule.wrapper[0] + script + NativeModule.wrapper…

最近のプログラミングって、ちょっとしたことやるにもプロジェクトディレクトリが必要でめんどいわー。ほんとにちょっとしたことならオンライン・プレイグラウンドで済ませる。んで、ちょっとしたこと用プロジェクトの作り方 node, npm, tsc はグローバルイ…

ESModules を使ったソースで、ts-node hoge.mts すると、ts-node が次のエラーを出す。 SyntaxError: Cannot use import statement outside a moduleファイル名が .mts 拡張子なので、"type": "module" 要らないはずだが、package.json に次を入れてみた。 "…

node.jsのモジュールサーチは評判が悪いようだが、確かに、どこからモジュールを持ってくるのかは分かりにくい。次のようにしよう。 nodeのコアモジュールのときは、node: スキームをつける。import fs from 'node:fs/promises'; インストールしたNPMパッケ…

https://dev.to/nathant/how-i-built-my-own-simplified-react-with-chevrotain-typescript-webpack-3ja6 ： const Let: chevrotain.ITokenConfig = createToken({ name: "Let", pattern: /let/, longer_alt: Identifier }); ↑型の指定が間違っている。戻り…