add a "Writing a plugin" example

[deer]

@bjesuiter, here's the issue. I guess you know enough of what to include. Of course I'm happy to discuss this if you want to.

from: https://github.com/denoland/fresh/pull/1545#issuecomment-1658412159

[thegaryroberts]

This would be appreciated as I tried to piece together a hello world plugin from a combination of the docs, fixtures & blog post and failed miserably.

As it happens after a couple of fruitless hours I failed to get a single new feature of 1.3.0 working. Even basic things like "Export multiple islands in the same file" & "Async Route Components", still sitting on 1.2.0 at present. Couldn't be sure if some sort of bad upgrade/cache issue, or many many things I was getting wrong!

New features really could do with standalone examples. Something to easily replicate and validate if user error or framework bug (the fixtures use a lot of internal code that makes replication challenging).

[bjesuiter]

I started restructuring the docs around plugins and extending the docs in this branch: #1555-improve-docs-about-plugin-creation

Quick question @deer : Should i include an opinionated section about how one might structure their repo for plugin dev? This might be good to explain:

• How to run an example fresh setup for your plugin inside a repo subfolder?
• How to publish your plugin to deno.land/x?

I'd base this on the repo of my first plugin "freshOpenprops":

• DenoLand X
• Github

If you've some time this days, I'd be glad to hear from you wether you think this is generally a good idea and what you think about the proposed structure in the repo.

[deer]

Yes, I think providing an opinionated project structure section is a great idea. Otherwise there will be followup questions asking those things. Overall it looks like you're on the right path!

[bjesuiter]

@deer I started an example repo which shows how to write and integrate different kinds of plugins.

Something seems to be wrong with my JSX Linting config, but i can't figure out, what's wrong. Could you check this repo out and validate whether this also breaks for you and maybe even why?

https://github.com/codemonument/deno_fresh_plugin_skeleton

Details

My plugin code works at runtime (plugin code and usage side in examples dir) but I get deno lint errors when going to example/routes/index.tsx:

Also, this simple _404.tsx gives me JSX Syntax Errors.

Heck, all my tsx-based files give me these JSX errors :D

[bjesuiter]

@marvinhagemeister May I ask you to have a look at my example repo?

I want to recommend a solid repo structure for plugin development and having jsx not recognized is a huge problem in my eyes.

I think it's a simple config problem, but I'm really clueless why it's not working. So, I'd reply appreciate a little help here, if you're time allow for it!

[marvinhagemeister]

@bjesuiter It's an issue with Deno's LSP not with Fresh. See https://github.com/denoland/deno/issues/20582 . I've forwarded it to the relevant folks here at Deno. The workaround is to run deno check mod.ts in your case to refresh the LSP cache.

EDIT: Asked around internally, and the problem with this specific repository is that the examples directory has another deno.json file. Currently the extension only supports reading the deno config at the project root. Support for workspaces is in progress, but I don't have an ETA.

[bjesuiter]

Thanks! I merged the ./example/deno.json with the top-level ./deno.jsonc and configured this as the only source import_map for the deno plugin and now it works! It's a little more involved than I'd like but nothing which could not be explained in the docs :)