Rails 7 Axios Paketi Import Sorunu

Yardım
1

Selamlar,
Rails 7 projemde axios paketini kullanmak istedim fakat aşağıda paylaştığım hata ile karşılaştım.

Ruby Version: 3.2.1
Rails Version: 7.0.7

Öncelikle ./bin/importmap pin axios komutu ile config/importmap.rb dosyama axios paketi ve bağımlılıklarını pin ettim. Dosya aşağıdaki gibi:

# Pin npm packages by running ./bin/importmap

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"
# komut sonrası
pin "axios", to: "https://ga.jspm.io/npm:[email protected]/index.js"
pin "#lib/adapters/http.js", to: "https://ga.jspm.io/npm:@jspm/[email protected]/nodelibs/@empty.js"
pin "#lib/platform/node/classes/FormData.js", to: "https://ga.jspm.io/npm:@jspm/[email protected]/nodelibs/@empty.js"
pin "#lib/platform/node/index.js", to: "https://ga.jspm.io/npm:@jspm/[email protected]/nodelibs/@empty.js"

Sonrasında hello_controller.js dosyama paketi import ettim.

import { Controller } from "@hotwired/stimulus"
import axios from "axios"

export default class extends Controller {
  connect() {
    console.log(axios)
    this.element.textContent = "Hello World!"
  }
}

Ama axios import edildiği an aşağıdaki hatayı alıyorum:

Screenshot 2023-08-12 at 19.51.44
Screenshot 2023-08-12 at 19.51.441564×168 41.3 KB

Daha önce farklı paketler ile çalıştığımda bu durum ile karşılaşmamıştım. Bu durumla karşılaşan varsa yardımcı olabilir mi?

2

./bin/importmap pin axios-on-rails Axios-on-rails NPM | npm.io paketini buldum. Js controller da import axios from "axios" dediğimde istek attım. Ama bu ne kadar doğru bilmiyorum :smiley: .

1 Beğeni
3

jspm yerine skypack kullanınca sorun kalmıyor :slight_smile:

config/importmap.rb’yi şu şekilde güncellemeniz yeterli;

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 "axios", to: "https://cdn.skypack.dev/[email protected]"

Referans olarak reddit’de ki şu konuşmaya da bakabilirsiniz :slight_smile:

https://www.reddit.com/r/rails/comments/zsacjo/comment/j17a68j/

2 Beğeni