UserCSSをbundleするDeno script
主にScrapboxの
UserCSSを一つのCSSファイルにまとめるDeno script
Scrapbox以外のCSSファイルの
bundleにも使える
optionを渡せばminifyもできる
用途
UserCSSの読み込みを速くする
2021-07-06 06:15:35 現在、各projectに手作業でコピペしているので、変更作業が大変
使い方
以下を実行する
shdeno run --allow-net --allow-read --allow-write --allow-run --allow-env --unstable https://scrapbox.io/api/code/takker/UserCSSをbundleするDeno_script/build.ts filename.css --bundle --minify
filename.css
bundleしたいstyleのentry point
localのファイルでもインターネット上のファイルでも可
--outfile
bundle後のCSSファイルのファイル名
指定しないとコードが標準出力に出力される
パイプを使って | pbcopy や | xsel をつなげれば、そのままクリップボードにコピーできる
あとはesbuildの引数と同じ
実装
実装したいこと
esbuildのオプション引数を全部羅列するのが面倒か
code
build.tsimport { run } from './script.ts';
import { parse } from 'https://deno.land/std@0.87.0/flags/mod.ts';
const {_: [entryFilePath], ...options} = parse(Deno.args);
if (typeof entryFilePath === 'number') throw Error('entryFilePath must be string');
await run(entryFilePath, options);
script.tsimport { exists } from "https://deno.land/std@0.97.0/fs/mod.ts";
import { build, stop } from 'https://deno.land/x/esbuild@v0.12.6/mod.js';
import type { BuildOptions, BuildResult } from 'https://deno.land/x/esbuild@v0.12.6/mod.js';
import httpFetch from 'https://deno.land/x/esbuild_plugin_http_fetch@v1.0.2/index.js'
// 特定のpropertyを削るやつ
type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
export async function run(filename: string, options: Omit<BuildOptions, 'entryPoints' | 'platform' | 'plugins'>) {
let useTempFile = false;
let result: BuildResult | undefined = undefined;
try {
if (/^https?:\/\//.test(filename)) {
const tempname = `index-${Math.random()}.css`;
await Deno.writeTextFile(tempname, `@import '${filename}';`);
filename = tempname;
useTempFile = true;
}
const _options: BuildOptions = {
entryPoints: [filename],
platform: 'neutral',
plugins: [httpFetch],
...options,
};
result = await build(_options);
stop();
} catch(e) {
throw e;
}finally {
//後始末
if (useTempFile) await Deno.remove(filename);
if (await exists('./cache')) await Deno.remove('./cache', { recursive: true });
}
return result;
}