スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

import.metaを使い、引数を渡してES Modulesを読み込む

GC64で実装されたimport.metaのurl属性には、そのモジュールのimport時に使用されたURL文字列がProtocolからQuery文字列までそのまま入っている。これを利用すればモジュール読込み時に読込み元からモジュール側へ、Query文字列を経由して引数を渡すようなことができる。

/*
    index.js
*/
import 'https://example.com/mod.mjs?foo=bar';

/*
    mod.mjs
*/
console.log(import.meta.url); // "https://example.com/mod.mjs?foo=bar"
const query = new URL(import.meta.url).searchParams;
query.get('foo'); // "bar"

物は試しで、さっそくQuery文字列によって挙動の変わるモジュールを一つ作ってみた。.mjs内でURLのQuery文字列からkey-valueを読込み、addEventListener時のoptionsに利用している。ChromeExtensionsのContentScriptsコンテキスト内では特に問題なく動作した。

余談だが、RawGit(GitHub用CDN)からCORSと転送コストを気にせずDynamic import()する流れが楽すぎて近未来感がすごい。便利なサービスや機能を提供してくれる人には感謝しかない。おしまい。

関連記事

コメントの投稿

非公開コメント

すポンサードリンク
最新記事
カテゴリ
DN (57)
CSS (2)
いろいろ
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。