~repos /edge-city
git clone https://pyrossh.dev/repos/edge-city.git
edge-city is a next level meta-framework for react that runs only on edge runtimes
2683d00d
—
Peter John 2 years ago
add page render
- packages/cli/index.js +47 -21
- packages/example/pages/about/page.jsx +1 -5
- packages/example/pages/page.jsx +1 -5
- packages/runtime/index.js +3 -2
packages/cli/index.js
CHANGED
|
@@ -64,6 +64,10 @@ const mapDeps = (dir) => {
|
|
|
64
64
|
const staticDir = path.join(process.cwd(), "build", "static");
|
|
65
65
|
|
|
66
66
|
const createDirs = () => {
|
|
67
|
+
const buildDir = path.join(process.cwd(), "build");
|
|
68
|
+
if (fs.existsSync(buildDir)) {
|
|
69
|
+
fs.rmSync(buildDir, { recursive: true });
|
|
70
|
+
}
|
|
67
71
|
if (!fs.existsSync(staticDir)) {
|
|
68
72
|
fs.mkdirSync(staticDir, { recursive: true });
|
|
69
73
|
}
|
|
@@ -106,20 +110,33 @@ const buildRouteMap = () => {
|
|
|
106
110
|
fs.writeFileSync(outfile, JSON.stringify(routemap, null, 2));
|
|
107
111
|
}
|
|
108
112
|
|
|
109
|
-
//
|
|
113
|
+
// let envPlugin = {
|
|
110
|
-
// name: '
|
|
114
|
+
// name: 'env',
|
|
111
|
-
// setup
|
|
115
|
+
// setup(build) {
|
|
116
|
+
// // Intercept import paths called "env" so esbuild doesn't attempt
|
|
117
|
+
// // to map them to a file system location. Tag them with the "env-ns"
|
|
112
|
-
//
|
|
118
|
+
// // namespace to reserve them for this plugin.
|
|
113
|
-
//
|
|
119
|
+
// build.onResolve({ filter: /^env$/ }, args => ({
|
|
120
|
+
// path: args.path,
|
|
121
|
+
// namespace: 'env-ns',
|
|
114
|
-
// }
|
|
122
|
+
// }))
|
|
123
|
+
|
|
124
|
+
// // Load paths tagged with the "env-ns" namespace and behave as if
|
|
125
|
+
// // they point to a JSON file containing the environment variables.
|
|
126
|
+
// build.onLoad({ filter: /.*/, namespace: 'env-ns' }, () => ({
|
|
127
|
+
// contents: JSON.stringify(process.env),
|
|
128
|
+
// loader: 'json',
|
|
129
|
+
// }))
|
|
115
|
-
// }
|
|
130
|
+
// },
|
|
116
|
-
// }
|
|
131
|
+
// }
|
|
117
132
|
|
|
118
133
|
|
|
119
134
|
const buildServer = async (src, type) => {
|
|
120
135
|
const buildStart = Date.now();
|
|
121
136
|
const shortName = src.replace(process.cwd(), "");
|
|
137
|
+
const outName = type === "service"
|
|
122
|
-
|
|
138
|
+
? "/_rpc" + shortName.replace("/services", "").replace(".service.js", ".js")
|
|
139
|
+
: shortName.replace("/pages", "").replace("page.jsx", "index.js");
|
|
123
140
|
const outfile = `${process.cwd()}/build/functions${outName}`;
|
|
124
141
|
const result = await esbuild.build({
|
|
125
142
|
bundle: true,
|
|
@@ -136,12 +153,33 @@ const buildServer = async (src, type) => {
|
|
|
136
153
|
jsx: 'automatic',
|
|
137
154
|
define: {
|
|
138
155
|
'process.env.NODE_ENV': `"${process.env.NODE_ENV}"`,
|
|
156
|
+
'process.env.PG_CONN_URL': "123",
|
|
139
157
|
},
|
|
140
158
|
plugins: [
|
|
141
159
|
resolve({
|
|
142
160
|
"/static/routemap.json": `${staticDir}/routemap.json`,
|
|
143
161
|
"/static/importmap.json": `${staticDir}/importmap.json`
|
|
144
162
|
}),
|
|
163
|
+
{
|
|
164
|
+
name: "parotta-plugin",
|
|
165
|
+
setup(build) {
|
|
166
|
+
build.onLoad({ filter: /\\*.page.jsx/, namespace: undefined }, (args) => {
|
|
167
|
+
const data = fs.readFileSync(args.path);
|
|
168
|
+
const newSrc = `
|
|
169
|
+
import { renderPage } from "parotta-runtime";
|
|
170
|
+
${data.toString()}
|
|
171
|
+
|
|
172
|
+
export function onRequest(context) {
|
|
173
|
+
return renderPage(Page, context.request);
|
|
174
|
+
}
|
|
175
|
+
`
|
|
176
|
+
return {
|
|
177
|
+
contents: newSrc,
|
|
178
|
+
loader: "jsx",
|
|
179
|
+
}
|
|
180
|
+
});
|
|
181
|
+
}
|
|
182
|
+
}
|
|
145
183
|
]
|
|
146
184
|
});
|
|
147
185
|
// console.log(await analyzeMetafile(result.metafile))
|
|
@@ -189,18 +227,6 @@ const main = async () => {
|
|
|
189
227
|
|
|
190
228
|
main();
|
|
191
229
|
|
|
192
|
-
// const serverRouter = await createServerRouter();
|
|
193
|
-
// const clientRouter = await createClientRouter();
|
|
194
|
-
// const transpiler = new Bun.Transpiler({
|
|
195
|
-
// loader: "jsx",
|
|
196
|
-
// autoImportJSX: true,
|
|
197
|
-
// jsxOptimizationInline: true,
|
|
198
|
-
|
|
199
|
-
// // TODO
|
|
200
|
-
// // autoImportJSX: false,
|
|
201
|
-
// // jsxOptimizationInline: false,
|
|
202
|
-
// });
|
|
203
|
-
|
|
204
230
|
// const renderCss = async (src) => {
|
|
205
231
|
// try {
|
|
206
232
|
// const cssText = await Bun.file(src).text();
|
packages/example/pages/about/page.jsx
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { Link, useRouter
|
|
2
|
+
import { Link, useRouter } from "parotta-runtime";
|
|
3
3
|
import { Helmet } from 'react-helmet-async';
|
|
4
4
|
import Layout from '@/components/Layout/Layout';
|
|
5
5
|
import "./page.css";
|
|
@@ -26,7 +26,3 @@ export const Page = () => {
|
|
|
26
26
|
}
|
|
27
27
|
|
|
28
28
|
export default Page;
|
|
29
|
-
|
|
30
|
-
export function onRequest(context) {
|
|
31
|
-
return renderPage(Page, context.request);
|
|
32
|
-
}
|
packages/example/pages/page.jsx
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useEffect } from 'react';
|
|
2
|
-
import { useRouter
|
|
2
|
+
import { useRouter } from "parotta-runtime";
|
|
3
3
|
import Layout from '@/components/Layout/Layout';
|
|
4
4
|
import Counter from "@/components/Counter/Counter";
|
|
5
5
|
import { Helmet } from 'react-helmet-async';
|
|
@@ -27,7 +27,3 @@ const Page = () => {
|
|
|
27
27
|
}
|
|
28
28
|
|
|
29
29
|
export default Page;
|
|
30
|
-
|
|
31
|
-
export function onRequest(context) {
|
|
32
|
-
return renderPage(Page, context.request);
|
|
33
|
-
}
|
packages/runtime/index.js
CHANGED
|
@@ -16,10 +16,11 @@ import routemap from '/static/routemap.json' assert {type: 'json'};
|
|
|
16
16
|
* CSR related functions
|
|
17
17
|
*/
|
|
18
18
|
|
|
19
|
+
export const isClient = () => typeof window !== 'undefined';
|
|
19
|
-
export const domain = () =>
|
|
20
|
+
export const domain = () => isClient() ? window.origin : "http://0.0.0.0:3000";
|
|
20
21
|
|
|
21
22
|
export const rpc = (serviceName) => async (params = {}) => {
|
|
22
|
-
const res = await fetch(`${domain()}/
|
|
23
|
+
const res = await fetch(`${domain()}/_rpc/${serviceName}`, {
|
|
23
24
|
method: "POST",
|
|
24
25
|
headers: {
|
|
25
26
|
"Accept": "application/json",
|