Skip to content

Introduce preserve_extname option for directory pin#261

Open
songjiz wants to merge 2 commits intorails:mainfrom
songjiz:preserve-extname
Open

Introduce preserve_extname option for directory pin#261
songjiz wants to merge 2 commits intorails:mainfrom
songjiz:preserve-extname

Conversation

@songjiz
Copy link

@songjiz songjiz commented Sep 12, 2024

This PR enhances the pin_all_from method to properly handle file extensions when pinning directories. It introduces a preserve_extname option to retain file extensions when needed, addressing compatibility issues with libraries like Shoelace that require .js extensions in their import statements.

Background

Shoelace's autoloader uses import statements that include the .js extension:

...
function register(tagName) {
  if (customElements.get(tagName)) {
    return Promise.resolve();
  }
  const tagWithoutPrefix = tagName.replace(/^sl-/i, "");
  const path = getBasePath(`components/${tagWithoutPrefix}/${tagWithoutPrefix}.js`);
  return new Promise((resolve, reject) => {
    import(path).then(() => resolve()).catch(() => reject(new Error(`Unable to autoload <${tagName}> from ${path}`)));
  });
}

The current importmap implementation removes file extensions by default, which can break Shoelace's autoloader functionality.

Usage Example

pin "application"
pin "@hotwired/turbo-rails", to: "turbo.min.js"
pin "@hotwired/stimulus", to: "stimulus.min.js"
pin "@hotwired/stimulus-loading", to: "stimulus-loading.js"
pin_all_from "app/javascript/controllers", under: "controllers"

pin_all_from "vendor/javascript/@shoelace-style/shoelace/cdn", under: "@shoelace-style/shoelace/cdn", preserve_extname: true, preload: false
// app/javascript/application.js
import "@hotwired/turbo-rails"
import "controllers"
import "@shoelace-style/shoelace/cdn/shoelace-autoloader.js"

With these changes, Shoelace can now correctly import components under "@shoelace-style/shoelace/cdn/" while maintaining compatibility with other libraries that don't require extensions.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant