Comments (7)
robinvdvleuten
commented on May 18, 2024
2
@developit that's exactly the kind of interface I meant! I do not expect that preact-cli becomes some kind of prext.js, but it would be great if it provides some kind of interface / functionality to build this kind of tooling upon. The only thing the preact-cli should do extra I guess is to expose the build process. Is there any way I can help with this?
from preact-cli.
robinvdvleuten
commented on May 18, 2024
2
@developit I've created a PR for exposing a compiler instance, let's continue the discussion there.
from preact-cli.
thangngoc89
commented on May 18, 2024
@robinvdvleuten I think preact-cli and next.js are 2 different beasts. You can serve the static build with any server. So no need for support from preact-cli. Just build your own :D
from preact-cli.
robinvdvleuten
commented on May 18, 2024
@thangngoc89 I am aware of that, but the preact-cli also has supports for prerendering. It would be nice if there is some sort of exposed API for this so that you still can rely on the webpack / babel configuration of this project :)
from preact-cli.
thangngoc89
commented on May 18, 2024
@robinvdvleuten I think the prerendering is done in build step. Check out index.html, you'll see the rendered code of your index route. No need for a server here
from preact-cli.
developit
commented on May 18, 2024
If we end up with a UMD or CommonJS bundle output from something like #71, you could use preact-cli as an opaque compiler within a Node server. I'm not sure it'd fit perfectly into preact-cli itself, but certainly I could see supporting something like this:
import { h } from 'preact';
import express from 'express';
import { build } from 'preact-cli';
import renderToString from 'preact-render-to-string';
const app = build('./client', { format: 'umd' }).then( output => require(output.main) );
const app = express();
app.get( (req, res) => {
app.then( App => {
let body = renderToString(<App url={req.path} />);
res.send(`<!doctype html><html lang="en">${body}`);
});
});
app.listen(process.env.PORT);Or, maybe we expose an full API where you could trigger and handle a client build, or invoke a high level API for SSR like prerender({ url }).
from preact-cli.
developit
commented on May 18, 2024
Any experimentation you have time to do would be appreciated. The API we can solidify later, but I'd love to get some experiments done around returning a reusable "preact compiler" instance.
from preact-cli.
Related Issues (20)
- compiling✖ ERROR Error: Babel-loader config not found!!! HOT 9
- Pages duplicate when accessing with /index.html HOT 9
- Brotli build - outputs content to same filename HOT 4
- default project template doesn't work with Node v18 HOT 4
- ERROR Error: error:0308010C:digital envelope routines::unsupported HOT 1
- Duplicated content when using /routes when using CLI v4 HOT 5
- Homepage content loaded on all non-prerendered pages HOT 3
- Add Typescript increasses the bundle size HOT 4
- Can't resolve 'preact-cli-entrypoint' HOT 4
- Exported rest param syntax functions create invalid build JS HOT 4
- preact-cli hangs after "✔ Done!" HOT 5
- CSS source maps missing in build output HOT 3
- Typescript v5.1.6 compatibility HOT 2
- Route code-splitting breaks lazy loading of images HOT 3
- Use esbuild instead of babel HOT 2
- Fail to build due to `property missing ':'` when inline style HOT 4
- "TypeError: Cannot read properties of undefined (reading 'call')" when trying to route split HOT 7
- OptimizeCssAssetsPlugin causes build to crash in Yarn PnP mode HOT 2
- Config file failure when adding plugins HOT 8
- build gets stuck at "after chunk asset optimization" HOT 11
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from preact-cli.