Inherit from ApplicationController without importing for each controller?

I know you can make use of JavaScript’s class inheritance to set up an “Application Controller” that will serve as the foundation for all of your controllers to build upon. How can you do this without calling import at the top of each file? After installing Stimulus in a fresh Rails app, you’re left with a app/javascript file.

Storing controllers in app/javascript/all/controllers and extending the Stimulus controllers from ApplicationController usually would require an import. Is there a way to put a base ApplicationController in app/javascript/ that could be globally accessible in the Stimulus controllers without having to declare import at the top of each controller?

Before

import ApplicationController from "./application_controller";

export default class extends ApplicationController {
  sayHi () {
    super();
    console.log("Hello from a Custom controller");
  }
}

After

export default class extends ApplicationController {
  sayHi () {
    super();
    console.log("Hello from a Custom controller");
  }
}

[georgeclaghorn]

Here’s the ProvidePlugin config we use with Webpacker (ApplicationController is in app/javascript/controllers/application_controller.js):

const { environment } = require('@rails/webpacker')
const webpack = require('webpack')

environment.plugins.append('Provide', new webpack.ProvidePlugin({
  ApplicationController: ['application_controller', 'default']
}))

[javan]

app/javascript is a default load path so it should work out of the box. We’re using fairly stock Webpacker setup.