Importmap für Rails

Import Maps ermöglichen es, JavaScript-Module mithilfe logischer Namen zu importieren, die auf versionierten/verschlüsselten Dateien verweisen – direkt im Browser. Dadurch können moderne JavaScript-Anwendungen unter Verwendung von JavaScript-Bibliotheken, die für ES-Module (ESM) erstellt wurden, erstellt werden, ohne dass eine Transpilierung oder Bündelung erforderlich ist. Das befreit dich von der Notwendigkeit von Webpack, Yarn, npm oder einem anderen Teil der JavaScript-Toolchain. Alles, was du benötigst, ist die bereits in Rails enthaltene Asset-Pipeline.

Installation

Die Importmap für Rails ist automatisch in Rails 7+ für neue Anwendungen enthalten, aber du kannst sie auch manuell in vorhandenen Anwendungen installieren:

Run ./bin/bundle add importmap-rails
Run ./bin/rails importmap:install

Hinweis: Um JavaScript aus Rails-Frameworks wie Action Cable, Action Text und Active Storage zu verwenden, muss Rails in der Version 7.0 oder höher ausgeführt werden. Dies war die erste Version, die mit ESM-kompatiblen Builds dieser Bibliotheken ausgeliefert wurde.

Bibliotheken manuell

Du kannst diese Bibliotheken manuell festlegen, indem du dich auf die kompilierten Versionen verlässt, die in Rails enthalten sind, wie folgt:

pin "application", preload: true
pin "@hotwired/turbo-rails", to: "turbo.min.js", preload: true
pin "@hotwired/stimulus", to: "stimulus.min.js", preload: true
pin "@hotwired/stimulus-loading", to: "stimulus-loading.js", preload: true
pin_all_from "app/javascript/controllers", under: "controllers"
pin "jquery", to: "https://ga.jspm.io/npm:jquery@3.7.0/dist/jquery.js"

oder per console

./bin/importmap pin trix

Quelle: https://github.com/rails/importmap-rails

Meld dich an und schreibe ein Kommentar