zombiezen / esbuild-plugin-stimulus Goto Github PK

When using esbuild, by default the extension of a stimulus controller that includes jsx needs to be .jsx. However this plugin will only load .js files.

See here:

https://github.com/zombiezen/esbuild-plugin-stimulus/blob/main/src/index.ts#L61-L64

Should we also load _controller.jsx files? @zombiezen

Hello @zombiezen and first of all, many thanks for this plugin which is the missing piece to our esbuild + Stimulus "puzzle".

In our app we stimulus controller in many different directories,

• sidecar Stimulus controllers for ViewComponent components in app/components/
• generic components share by the 3 parts of our app in app/javascript/controllers/shared
• components for specific part of our app in directories like app/javascript/controllers/shop and app/javascript/controllers/backoffice

Due to this, some controllers cannot be imported (those outside app/javascript/controllers) and some others are namespaced backoffice-- or shop-- while they should not be.

Is there a way to pass a list of base directories to esbuildand/or your plugin to specify directories without adding code the the plugin ? Or should the plugin be modified ?

If anyone at @levups could be of any help, let us know :)

Given this directory layout:

foo.js
src/foo/controllers.js
src/foo/controllers/*

// foo.js
import 'src/foo/controllers'

// src/foo/controllers.js
import { controllers } from 'stimulus:./controllers';

I get the following error:

No matching export in "stimulus_ns:/.../app/javascript/src/foo/controllers" for import "controllers"

I've tried changing the name of controller.js to stimulus_controllers.js but that doesn't make a difference.

We have multiple scripts which are loading both their own controllers in the old webpack way as well as registering shared controllers.

I've also tried moving it down the foo.js like so but get the same error:

import { Application } from '@hotwired/stimulus';
import { controllers } from 'stimulus:./src/foo/controllers';

const application = Application.start();
application.load(controllers);

No matching export in "stimulus_ns:/.../app/javascript/src/foo/controllers" for import "controllers"

Currently, only underscores are supported.

Hello
Thanks for the great plugin

I noticed the "stimulus_ns" entry in my generated source map had the absolute path of the Stimulus controllers folder. This meant on production I was leaking information about the directory structure of my server e.g.

"stimulus_ns:/home/myuser/railsapp/app/javascript/controllers"

My workaround:

I replaced the returned path in build.onResolve with

return {
  path: path.relative(process.cwd(), path.join(path.dirname(args.importer), sep)), //change from absolute to relative directory
  namespace,
};

and the resolveDir in build.onLoad with

return {
  contents,
  loader: 'js',
  resolveDir: path.join(process.cwd(), args.path), //change from relative to absolute directory
};

Hope that helps, not sure if it's the correct approach or desirable as a PR.

The current behavior of the plugin is to ignore directory-not-found errors and return an empty definition list. This probably shouldn't be the default and should instead be an opt-in.

Welcome to the hype :)

This plug-in doesn't recursively look through controller folders.

If you do several imports it works but the definitions are not prefixed with the namespace as expected

How about adding resursive lookup of controllers?