@naiv/react-bundler 0.0.2 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +0 -0
- package/dist/index.d.ts +5 -8
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +25 -79
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/README.md
ADDED
|
File without changes
|
package/dist/index.d.ts
CHANGED
|
@@ -2,14 +2,11 @@ export interface FileSource {
|
|
|
2
2
|
path: string;
|
|
3
3
|
content: string;
|
|
4
4
|
}
|
|
5
|
-
/**
|
|
6
|
-
* Generates and minifies Tailwind CSS for the given source strings using Tailwind v4 API.
|
|
7
|
-
*/
|
|
8
5
|
export declare function generateCSS(source: string, other_sources: FileSource[]): Promise<string>;
|
|
9
|
-
/**
|
|
10
|
-
* Bundles React TSX code into a single minified JS string using esbuild.
|
|
11
|
-
* Supports modularity through a virtual file system plugin.
|
|
12
|
-
*/
|
|
13
6
|
export declare function bundleJS(source: string, other_sources: FileSource[]): Promise<string>;
|
|
14
|
-
export
|
|
7
|
+
export interface PageMetadata {
|
|
8
|
+
title?: string;
|
|
9
|
+
description?: string;
|
|
10
|
+
}
|
|
11
|
+
export declare function bundleHTML(source: string, other_sources: FileSource[], metadata: PageMetadata): Promise<string>;
|
|
15
12
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAKA,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,MAAM,CAAA;CAChB;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAKA,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,MAAM,CAAA;CAChB;AAGD,wBAAsB,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,GAAG,OAAO,CAAC,MAAM,CAAC,CA+B9F;AA8CD,wBAAsB,QAAQ,CAAC,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,GAAG,OAAO,CAAC,MAAM,CAAC,CAoB3F;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,wBAAsB,UAAU,CAAC,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,EAAE,QAAQ,EAAE,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC,CAmBrH"}
|
package/dist/index.js
CHANGED
|
@@ -10,57 +10,53 @@ const tailwindcss_1 = require("tailwindcss");
|
|
|
10
10
|
const node_fs_1 = __importDefault(require("node:fs"));
|
|
11
11
|
const node_path_1 = __importDefault(require("node:path"));
|
|
12
12
|
const esbuild_1 = require("esbuild");
|
|
13
|
-
|
|
14
|
-
* Generates and minifies Tailwind CSS for the given source strings using Tailwind v4 API.
|
|
15
|
-
*/
|
|
13
|
+
// Generates and minifies Tailwind CSS using Tailwind v4 API
|
|
16
14
|
async function generateCSS(source, other_sources) {
|
|
17
15
|
// Find the Tailwind base CSS file
|
|
18
|
-
const
|
|
19
|
-
const
|
|
16
|
+
const tailwind_main_css_path = node_path_1.default.resolve(process.cwd(), 'node_modules/tailwindcss/index.css');
|
|
17
|
+
const base_css = node_fs_1.default.readFileSync(tailwind_main_css_path, 'utf8');
|
|
20
18
|
// Load the design system with the base CSS
|
|
21
|
-
const compiler = await (0, tailwindcss_1.compile)(
|
|
22
|
-
base: node_path_1.default.dirname(
|
|
19
|
+
const compiler = await (0, tailwindcss_1.compile)(base_css, {
|
|
20
|
+
base: node_path_1.default.dirname(tailwind_main_css_path),
|
|
23
21
|
loadStylesheet: async (id, base) => {
|
|
24
|
-
const
|
|
22
|
+
const resolved_path = node_path_1.default.resolve(base, id);
|
|
25
23
|
return {
|
|
26
|
-
content: node_fs_1.default.readFileSync(
|
|
27
|
-
base: node_path_1.default.dirname(
|
|
28
|
-
path:
|
|
24
|
+
content: node_fs_1.default.readFileSync(resolved_path, 'utf8'),
|
|
25
|
+
base: node_path_1.default.dirname(resolved_path),
|
|
26
|
+
path: resolved_path
|
|
29
27
|
};
|
|
30
28
|
}
|
|
31
29
|
});
|
|
32
30
|
// Extract candidates from all sources
|
|
33
|
-
const
|
|
34
|
-
const candidates =
|
|
31
|
+
const all_contents = [source, ...other_sources.map(s => s.content)];
|
|
32
|
+
const candidates = all_contents
|
|
35
33
|
.flatMap(content => Array.from(content.matchAll(/(?:className|class)\s*=\s*["']([^"']+)["']/g)))
|
|
36
34
|
.flatMap(match => (match[1] || '').split(/\s+/))
|
|
37
35
|
.filter(Boolean);
|
|
38
36
|
// Build the CSS
|
|
39
37
|
const css = compiler.build(candidates);
|
|
40
38
|
// Minify CSS using esbuild
|
|
41
|
-
const
|
|
42
|
-
return
|
|
39
|
+
const minified_css = await (0, esbuild_1.transform)(css, { loader: 'css', minify: true });
|
|
40
|
+
return minified_css.code;
|
|
43
41
|
}
|
|
44
|
-
|
|
45
|
-
* esbuild plugin to resolve virtual files from other_sources.
|
|
46
|
-
*/
|
|
42
|
+
// esbuild plugin to resolve virtual files from other_sources.
|
|
47
43
|
function virtualFsPlugin(other_sources) {
|
|
48
44
|
return {
|
|
49
45
|
name: 'virtual-fs',
|
|
50
46
|
setup(build) {
|
|
51
|
-
//
|
|
47
|
+
// resolve IDs for virtual files
|
|
52
48
|
build.onResolve({ filter: /^\.\.?\// }, args => {
|
|
53
49
|
// Normalize the path relative to the current directory
|
|
54
50
|
// In this simple example, we assume everything is relative to cwd
|
|
55
|
-
let
|
|
56
|
-
|
|
51
|
+
let relative_path = node_path_1.default.join(args.resolveDir, args.path.replace(/^\.\//, ''));
|
|
52
|
+
relative_path = node_path_1.default.relative(process.cwd(), relative_path);
|
|
57
53
|
// Try to match with extensions
|
|
58
54
|
const possiblePaths = [
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
55
|
+
relative_path,
|
|
56
|
+
relative_path + '.tsx',
|
|
57
|
+
relative_path + '.ts',
|
|
58
|
+
relative_path + '.jsx',
|
|
59
|
+
relative_path + '.js',
|
|
64
60
|
];
|
|
65
61
|
const match = other_sources.find(s => possiblePaths.includes(s.path));
|
|
66
62
|
if (match) {
|
|
@@ -83,10 +79,6 @@ function virtualFsPlugin(other_sources) {
|
|
|
83
79
|
},
|
|
84
80
|
};
|
|
85
81
|
}
|
|
86
|
-
/**
|
|
87
|
-
* Bundles React TSX code into a single minified JS string using esbuild.
|
|
88
|
-
* Supports modularity through a virtual file system plugin.
|
|
89
|
-
*/
|
|
90
82
|
async function bundleJS(source, other_sources) {
|
|
91
83
|
const result = await (0, esbuild_1.build)({
|
|
92
84
|
stdin: {
|
|
@@ -107,7 +99,7 @@ async function bundleJS(source, other_sources) {
|
|
|
107
99
|
});
|
|
108
100
|
return result.outputFiles ? result.outputFiles[0]?.text || '' : '';
|
|
109
101
|
}
|
|
110
|
-
async function bundleHTML(source, other_sources) {
|
|
102
|
+
async function bundleHTML(source, other_sources, metadata) {
|
|
111
103
|
const css = await generateCSS(source, other_sources);
|
|
112
104
|
const js = await bundleJS(source, other_sources);
|
|
113
105
|
const html = `<!DOCTYPE html>
|
|
@@ -115,7 +107,8 @@ async function bundleHTML(source, other_sources) {
|
|
|
115
107
|
<head>
|
|
116
108
|
<meta charset="UTF-8">
|
|
117
109
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
118
|
-
<title
|
|
110
|
+
<title>${metadata?.title ?? 'My Page'}</title>
|
|
111
|
+
<meta name="${metadata.description || ''}">
|
|
119
112
|
<style>${css}</style>
|
|
120
113
|
</head>
|
|
121
114
|
<body>
|
|
@@ -125,51 +118,4 @@ async function bundleHTML(source, other_sources) {
|
|
|
125
118
|
</html>`;
|
|
126
119
|
return html;
|
|
127
120
|
}
|
|
128
|
-
// async function main() {
|
|
129
|
-
// const logoComponent: FileSource = {
|
|
130
|
-
// path: 'components/Logo.tsx',
|
|
131
|
-
// content: `
|
|
132
|
-
// import React from 'react';
|
|
133
|
-
// export function Logo() {
|
|
134
|
-
// return (
|
|
135
|
-
// <div className="flex items-center space-x-2 bg-white p-3 rounded-full shadow-sm border border-teal-100 mb-6">
|
|
136
|
-
// <div className="w-8 h-8 bg-teal-500 rounded-full flex items-center justify-center text-white font-bold">N</div>
|
|
137
|
-
// <div className="font-bold text-teal-800">Naiv Modularity</div>
|
|
138
|
-
// </div>
|
|
139
|
-
// );
|
|
140
|
-
// }
|
|
141
|
-
// `
|
|
142
|
-
// };
|
|
143
|
-
// const entryPointCode = `
|
|
144
|
-
// import { createRoot } from 'react-dom/client';
|
|
145
|
-
// import React from 'react';
|
|
146
|
-
// import { Logo } from './components/Logo';
|
|
147
|
-
// function App() {
|
|
148
|
-
// return <div className='flex flex-col items-center text-teal-600 justify-center min-h-screen bg-teal-50'>
|
|
149
|
-
// <Logo />
|
|
150
|
-
// <div className="text-5xl font-extrabold mb-6 tracking-tight text-teal-900">Hello Standalone World</div>
|
|
151
|
-
// <div className="p-8 bg-white/80 backdrop-blur-md rounded-2xl shadow-2xl border border-white/20 max-w-md text-center">
|
|
152
|
-
// <p className="text-lg text-teal-700 leading-relaxed">
|
|
153
|
-
// Everything you see here is bundled programmatically into a <span className="font-bold text-teal-600">single HTML file</span>.
|
|
154
|
-
// </p>
|
|
155
|
-
// <div className="mt-6 flex justify-center space-x-3">
|
|
156
|
-
// <span className="px-3 py-1 bg-teal-100 text-teal-700 rounded-md text-sm font-medium">Tailwind v4</span>
|
|
157
|
-
// <span className="px-3 py-1 bg-blue-100 text-blue-700 rounded-md text-sm font-medium">esbuild</span>
|
|
158
|
-
// <span className="px-3 py-1 bg-purple-100 text-purple-700 rounded-md text-sm font-medium">React</span>
|
|
159
|
-
// </div>
|
|
160
|
-
// </div>
|
|
161
|
-
// </div>;
|
|
162
|
-
// }
|
|
163
|
-
// const doc = document.getElementById('root');
|
|
164
|
-
// if (doc) {
|
|
165
|
-
// const root = createRoot(doc);
|
|
166
|
-
// root.render(<App />);
|
|
167
|
-
// }
|
|
168
|
-
// `;
|
|
169
|
-
// const html = await bundleHTML(entryPointCode, [logoComponent]);
|
|
170
|
-
// const outputPath = path.resolve(process.cwd(), 'index.html');
|
|
171
|
-
// fs.writeFileSync(outputPath, html);
|
|
172
|
-
// console.log(`Successfully generated standalone app: ${outputPath}`);
|
|
173
|
-
// }
|
|
174
|
-
// main().catch(console.error).finally(() => process.exit(0));
|
|
175
121
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"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"}
|