Skip to content

Commit 0682d15

Browse files
hi2ma-bu4hi2ma-bu4
committed
🎉 node.js方式に変更
1 parent 36097ac commit 0682d15

22 files changed

+3241
-62
lines changed

‎.gitignore‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,3 @@
1-
*.html
2-
*.htm
3-
*.css
4-
*.d.ts
1+
**/node_modules/**
52

6-
main.js
3+
*.d.ts

‎JavaLibraryScript.code-workspace‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,5 +4,9 @@
44
"path": "."
55
}
66
],
7-
"settings": {}
7+
"settings": {
8+
"cSpell.words": [
9+
"javalibraryscript"
10+
]
11+
}
812
}

‎dev/build.js‎

Lines changed: 119 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
const browserify = require("browserify");
2+
const exorcist = require("exorcist");
3+
const fs = require("node:fs");
4+
const path = require("node:path");
5+
const { minify } = require("terser");
6+
7+
const generateIndex = require("./generateIndex.js");
8+
const CL = require("./libs/ColorLogger.js");
9+
10+
const script_name = "JavaLibraryScript";
11+
12+
const baseDir = path.join(__dirname, "..");
13+
14+
const distDir = path.join(baseDir, "dist");
15+
const entryDir = path.join(baseDir, "src");
16+
17+
const entry = path.join(entryDir, "main.js");
18+
const bundlePath = path.join(distDir, `${script_name}.js`);
19+
const bundleMapPath = path.join(distDir, `${script_name}.js.map`);
20+
const minPath = path.join(distDir, `${script_name}.min.js`);
21+
const minMapPath = path.join(distDir, `${script_name}.min.js.map`);
22+
23+
// 相対座標を取得
24+
function getRelativePath(name) {
25+
return path.relative(baseDir, name);
26+
}
27+
28+
// distディレクトリのクリーン＆作成
29+
function prepareDist() {
30+
if (fs.existsSync(distDir)) {
31+
fs.rmSync(distDir, { recursive: true, force: true });
32+
}
33+
fs.mkdirSync(distDir, { recursive: true });
34+
}
35+
36+
// ファイルサイズを見やすく表示
37+
function formatSize(bytes) {
38+
if (bytes < 1024) return bytes + " B";
39+
if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(2) + " KB";
40+
return (bytes / (1024 * 1024)).toFixed(2) + " MB";
41+
}
42+
43+
// ファイルサイズ取得
44+
function showFileSize(filePath) {
45+
const stat = fs.statSync(filePath);
46+
console.log(`📦 ${CL.brightWhite(path.basename(filePath))}: ${CL.brightGreen(formatSize(stat.size))}`);
47+
}
48+
49+
// Browserifyでバンドル
50+
function bundle() {
51+
return new Promise((resolve, reject) => {
52+
const b = browserify(entry, {
53+
cache: {},
54+
packageCache: {},
55+
debug: true, // source map生成のため必須
56+
});
57+
const writeStream = fs.createWriteStream(bundlePath);
58+
59+
b.bundle()
60+
.pipe(exorcist(bundleMapPath)) // ここでmapを外部化
61+
.pipe(writeStream);
62+
63+
writeStream.on("finish", () => {
64+
const code = fs.readFileSync(bundlePath, "utf-8");
65+
resolve(code);
66+
});
67+
writeStream.on("error", reject);
68+
});
69+
}
70+
71+
// Terserでminify（drop_consoleなど最適化オプション付き）
72+
async function minifyCode(code) {
73+
const result = await minify(code, {
74+
compress: {
75+
drop_console: true,
76+
passes: 2,
77+
pure_funcs: ["console.info", "console.debug", "console.warn"],
78+
},
79+
mangle: {
80+
toplevel: true,
81+
},
82+
format: {
83+
comments: false,
84+
},
85+
sourceMap: {
86+
filename: path.basename(minPath),
87+
url: path.basename(minMapPath),
88+
},
89+
});
90+
fs.writeFileSync(minPath, result.code);
91+
fs.writeFileSync(minMapPath, result.map);
92+
}
93+
94+
(async () => {
95+
try {
96+
//
97+
console.log(`🔁 ${CL.brightWhite("index.js自動生成開始...")}`);
98+
generateIndex(entryDir);
99+
console.log(`🌱 ${CL.brightWhite("自動生成完了")}`);
100+
//
101+
console.log(`🗑️ ${CL.brightWhite("distフォルダリセット")}`);
102+
prepareDist();
103+
//
104+
console.log(`🗂️ ${CL.brightWhite("バンドル中...")}`);
105+
const code = await bundle();
106+
console.log(`✨ ${CL.brightWhite("バンドル完了")}: ${getRelativePath(bundlePath)}`);
107+
console.log(`🗺️ ${CL.brightWhite("ソースマップ生成")}: ${getRelativePath(bundleMapPath)}`);
108+
109+
console.log(`🔧 ${CL.brightWhite("Minify中...")}`);
110+
await minifyCode(code);
111+
console.log(`✅ ${CL.brightWhite("Minify完了:")} ${getRelativePath(minPath)}`);
112+
console.log(`🗺️ ${CL.brightWhite("ソースマップ生成[min]")}: ${getRelativePath(minMapPath)}`);
113+
showFileSize(bundlePath);
114+
showFileSize(minPath);
115+
} catch (e) {
116+
console.error("❌ ビルド失敗:", e);
117+
process.exit(1);
118+
}
119+
})();

‎dev/generateIndex.js‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
const fs = require("node:fs");
2+
const path = require("node:path");
3+
4+
const CL = require("./libs/ColorLogger.js");
5+
6+
/**
7+
* index.jsを生成する
8+
* @param {string} dir
9+
*/
10+
function generateIndex(dir, baseDir = dir) {
11+
const entries = fs.readdirSync(dir, { withFileTypes: true });
12+
13+
// jsファイルだけ、かつindex.jsは除外
14+
const jsFiles = entries.filter((e) => e.isFile() && e.name.endsWith(".js") && e.name !== "index.js");
15+
16+
// サブディレクトリ
17+
const subDirs = entries.filter((e) => e.isDirectory());
18+
19+
// 先にサブディレクトリも再帰処理（深い階層から順に）
20+
for (const subDir of subDirs) {
21+
generateIndex(path.join(dir, subDir.name), baseDir);
22+
}
23+
24+
// export文を作成
25+
let exportsObj = {};
26+
27+
// ファイルのエクスポートを設定
28+
jsFiles.forEach((file) => {
29+
const name = path.basename(file.name, ".js");
30+
exportsObj[name] = `require("./${file.name}")`;
31+
});
32+
33+
// サブフォルダのindexもexport
34+
subDirs.forEach((subDir) => {
35+
const name = subDir.name;
36+
exportsObj[name] = `require("./${name}/index.js")`;
37+
});
38+
39+
// module.exportsの内容を文字列で作成
40+
const exportLines = Object.entries(exportsObj).map(([key, val]) => ` ${key}: ${val}`);
41+
42+
const content = `module.exports = {\n${exportLines.join(",\n")}\n};\n`;
43+
44+
// index.jsを書き込み
45+
fs.writeFileSync(path.join(dir, "index.js"), content, "utf8");
46+
47+
console.log(`📜 Generated index.js in ${CL.brightBlue(path.relative(path.dirname(baseDir), dir))}`);
48+
}
49+
50+
module.exports = generateIndex;

‎dev/libs/ColorLogger.js‎

Lines changed: 107 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
// ColorLogger.js
2+
class ColorLogger {
3+
static RESET = "\x1b[0m";
4+
5+
static COLORS = {
6+
black: "\x1b[30m",
7+
red: "\x1b[31m",
8+
green: "\x1b[32m",
9+
yellow: "\x1b[33m",
10+
blue: "\x1b[34m",
11+
magenta: "\x1b[35m",
12+
cyan: "\x1b[36m",
13+
white: "\x1b[37m",
14+
15+
// 明るい色
16+
brightRed: "\x1b[91m",
17+
brightGreen: "\x1b[92m",
18+
brightYellow: "\x1b[93m",
19+
brightBlue: "\x1b[94m",
20+
brightMagenta: "\x1b[95m",
21+
brightCyan: "\x1b[96m",
22+
brightWhite: "\x1b[97m",
23+
};
24+
25+
static BGS = {
26+
bgRed: "\x1b[41m",
27+
bgGreen: "\x1b[42m",
28+
bgYellow: "\x1b[43m",
29+
bgBlue: "\x1b[44m",
30+
bgMagenta: "\x1b[45m",
31+
bgCyan: "\x1b[46m",
32+
bgWhite: "\x1b[47m",
33+
};
34+
35+
static STYLE = {
36+
bold: "\x1b[1m",
37+
underline: "\x1b[4m",
38+
reverse: "\x1b[7m",
39+
};
40+
41+
static color(text, ...codes) {
42+
return `${codes.join("")}${text}${ColorLogger.RESET}`;
43+
}
44+
45+
// ↓ よく使う色はショートカットで static メソッド化
46+
static red(text) {
47+
return this.color(text, this.COLORS.red);
48+
}
49+
static green(text) {
50+
return this.color(text, this.COLORS.green);
51+
}
52+
static yellow(text) {
53+
return this.color(text, this.COLORS.yellow);
54+
}
55+
static blue(text) {
56+
return this.color(text, this.COLORS.blue);
57+
}
58+
static magenta(text) {
59+
return this.color(text, this.COLORS.magenta);
60+
}
61+
static cyan(text) {
62+
return this.color(text, this.COLORS.cyan);
63+
}
64+
static white(text) {
65+
return this.color(text, this.COLORS.white);
66+
}
67+
68+
static brightRed(text) {
69+
return this.color(text, this.COLORS.brightRed);
70+
}
71+
static brightGreen(text) {
72+
return this.color(text, this.COLORS.brightGreen);
73+
}
74+
static brightYellow(text) {
75+
return this.color(text, this.COLORS.brightYellow);
76+
}
77+
static brightBlue(text) {
78+
return this.color(text, this.COLORS.brightBlue);
79+
}
80+
static brightMagenta(text) {
81+
return this.color(text, this.COLORS.brightMagenta);
82+
}
83+
static brightCyan(text) {
84+
return this.color(text, this.COLORS.brightCyan);
85+
}
86+
static brightWhite(text) {
87+
return this.color(text, this.COLORS.brightWhite);
88+
}
89+
90+
static bold(text) {
91+
return this.color(text, this.STYLE.bold);
92+
}
93+
static underline(text) {
94+
return this.color(text, this.STYLE.underline);
95+
}
96+
static reverse(text) {
97+
return this.color(text, this.STYLE.reverse);
98+
}
99+
100+
// 任意カラー適用（複数コード）
101+
static custom(text, ...styleKeys) {
102+
const codes = styleKeys.map((key) => this.COLORS[key] || this.BGS[key] || this.STYLE[key] || "");
103+
return this.color(text, ...codes);
104+
}
105+
}
106+
107+
module.exports = ColorLogger;

0 commit comments

Comments
 (0)