Example not working

[sandro-pasquali]

Version: 1.0.2

Details

Example fails with TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".marko" for <path to template.marko>

Expected Behavior

rendered Marko when calling server

Your Environment

• Node 17.2.0
• OSX M1 Monterey

Steps to Reproduce

Run the example in README, in the above environment.

[DylanPiercey]

I believe the issue is that you haven't configured the environment to be able to load Marko templates.

Marko is not understood by node or any environment by default and has to be preprocessed. In node you can use the Marko require hook require("@marko/compiler/register"), but we currently recommend bundling the node server for the best experience. You can see this in many of our boilerplate/example repos with webpack/rollup/vite https://github.com/marko-js/examples/.

I added a note to the docs here about this as well.

[mikko-severo]

Hi,

Beginner here, can I use "import "@marko/compiler/register" " to use the Marko required hook?

[DylanPiercey]

@mikko-severo we highly recommend avoiding using the Marko compiler hook. Marko is designed to be used with a bundler since one of the points of Marko is to be able to load just the JS needed for the client.

I'd recommend starting from one of our Vite template projects, eg

npm init marko -- --template vite-fastify

[mikko-severo]

@DylanPiercey Thanks for the insight and fast reply. I mainly needed Marko for the server rending (no need for a bundler, I think), but I couldn't just get it to work. I keep getting the error the OP posted when using Fastify w/ESM or CMJ syntax. Although I got it working with Express w/ CMJ syntax by requiring the "Marko/compiler/register."

Any idea how I can get it to work with Fastify for server rendering?

Thanks

[DylanPiercey]

@mikko-severo I still think even if you just want to use Marko for the server you should use a bundler. Here is vite express example which only bundles the server side https://github.com/DylanPiercey/marko-vite-express-ssr-only

Benefit here is that in prod your server startup doesn't need to go through the Marko compiler, and in dev you get cool things like hot reloading for your server code.

It also has an incremental path to using the client side bundler when/if you want to.

[mikko-severo]

Hi @DylanPiercey
Thanks. I got it to work w/common js.

`require('@marko/compiler/register');
const fastify = require('fastify')({
logger: false
}),
template=require( "./template.marko"),
// markoPlugin =require("@marko/fastify") ;

// fastify.register(markoPlugin);
// Declare a route
fastify.get('/', function (request, reply) {
let render = template.default.renderToString({}),
res_body = {"view": render };
//return res_body
reply.send(res_body);
})

// Run the server!
fastify.listen({ port: 3000 }, function (err, address) {
if (err) {
fastify.log.error(err)
process.exit(1)
}
// Server is now listening on ${address}
})`