Fixes #5: Refactor code quality - Part 1
- Split index.js from 1,567 lines to 456 lines (73% reduction)
- Extracted settings event listeners to src/systems/ui/settingsListeners.js
- Extracted settings panel to src/core/settingsPanel.js
- Simplified initUI() and main initialization block
- Modularized style.css into 28 logical CSS modules in src/styles/
- Added build script (npm run build:css) to concatenate modules
- Modules: panel, components, user-stats, info-box, thoughts, settings,
themes, modals, mobile, inventory, quests, equipment, encounters,
weather, music-player, FAB widgets, strip widgets, etc.
- Updated package.json with build:css script and type: module
No functional changes - pure refactoring for maintainability.
This commit is contained in:
@@ -0,0 +1,70 @@
|
||||
#!/usr/bin/env node
|
||||
/**
|
||||
* CSS Build Script
|
||||
* Concatenates modular CSS files from src/styles/ into style.css
|
||||
*
|
||||
* Usage: node scripts/build-css.js
|
||||
*
|
||||
* File order matters! Files are concatenated in alphabetical order.
|
||||
* Prefix files with numbers to control order: _01_variables.css, _02_panel.css, etc.
|
||||
*/
|
||||
|
||||
import fs from 'fs-extra';
|
||||
import path from 'path';
|
||||
import { fileURLToPath } from 'url';
|
||||
|
||||
const __filename = fileURLToPath(import.meta.url);
|
||||
const __dirname = path.dirname(__filename);
|
||||
const rootDir = path.resolve(__dirname, '..');
|
||||
const stylesDir = path.join(rootDir, 'src', 'styles');
|
||||
const outputFile = path.join(rootDir, 'style.css');
|
||||
|
||||
async function buildCSS() {
|
||||
console.log('Building CSS from src/styles/...');
|
||||
|
||||
// Read all CSS files from src/styles/
|
||||
const files = await fs.readdir(stylesDir);
|
||||
const cssFiles = files
|
||||
.filter(f => f.endsWith('.css'))
|
||||
.sort() // Alphabetical order (use _01_, _02_ prefix for control)
|
||||
.map(f => path.join(stylesDir, f));
|
||||
|
||||
if (cssFiles.length === 0) {
|
||||
console.error('No CSS files found in src/styles/');
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
console.log(`Found ${cssFiles.length} CSS files:`);
|
||||
cssFiles.forEach(f => console.log(` - ${path.basename(f)}`));
|
||||
|
||||
// Read and concatenate all files
|
||||
const contents = [];
|
||||
for (const file of cssFiles) {
|
||||
const content = await fs.readFile(file, 'utf-8');
|
||||
const basename = path.basename(file);
|
||||
contents.push(`/* ============================================ */`);
|
||||
contents.push(`/* ${basename} */`);
|
||||
contents.push(`/* ============================================ */`);
|
||||
contents.push('');
|
||||
contents.push(content);
|
||||
contents.push('');
|
||||
}
|
||||
|
||||
const combined = contents.join('\n');
|
||||
|
||||
// Write to style.css
|
||||
await fs.writeFile(outputFile, combined, 'utf-8');
|
||||
|
||||
const stats = await fs.stat(outputFile);
|
||||
const lines = combined.split('\n').length;
|
||||
const sizeKB = (stats.size / 1024).toFixed(1);
|
||||
|
||||
console.log(`\n✅ Built ${outputFile}`);
|
||||
console.log(` Lines: ${lines}`);
|
||||
console.log(` Size: ${sizeKB} KB`);
|
||||
}
|
||||
|
||||
buildCSS().catch(err => {
|
||||
console.error('Build failed:', err);
|
||||
process.exit(1);
|
||||
});
|
||||
Reference in New Issue
Block a user