Блог

Главная - Вопросы по программированию - WebPacker не загружает модуль (metisMenu)

WebPacker не загружает модуль (metisMenu)

#jquery #ruby-on-rails #webpacker #metismenu

#jquery #ruby-on-rails #webpacker #metismenu

Вопрос:

Я столкнулся с проблемой при загрузке плагина metisMenu в Webpacker / Rails 6

Я продолжаю получать ошибку: Uncaught TypeError: $(...).metisMenu is not a function

Это содержимое из application.js :

 require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")

import '../stylesheets/application'
import 'assets/images'

import 'bootstrap'

document.addEventListener('turbolinks:load', () => {
  $('[data-toggle="tooltip"]').tooltip()
  $('[data-toggle="popover"]').popover()
})

import 'metismenu'

import 'assets/javascripts/vendor.js'
import 'assets/javascripts/app.js'
import 'assets/stylesheets/icons.css'
import 'assets/stylesheets/app-creative.css'

config/webpack/environment.js:

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

environment.plugins.append('Provide', new webpack.ProvidePlugin({
  $: 'jquery/src/jquery',
  'window.jQuery': 'jquery/src/jquery',
  jQuery: 'jquery/src/jquery',
  jquery: 'jquery/src/jquery',
  Popper: ['popper.js', 'default']
}))

module.exports = environment

Комментарии:

1. вы включили jquery?

2. Да, я сделал : yarn add bootstrap jquery popper.js metismenu и вставил конфигурацию environment.js соответствующим образом. Например: $('H1').html('Change H1 text') работает `

3. Ошибка означает, что вы неправильно включили файл metis menu JS в HTML-страницу. Мы не можем помочь дальше, поскольку вы не включили этот код в вопрос

4. Это верно, но я не вижу, где все пошло не так. Я сделал yarn add metismenu и, следовательно, вставил import 'metismenu' в свой application.js . Если я проверю свою /node_modules папку, она присутствует. Другие библиотеки JS, похоже, включены нормально.

Ответ №1:

Все, что я могу сказать, это то, что этот код работает до полной загрузки metisMenu. Решение не может быть создано без просмотра вашей конфигурации.

Комментарии:

1. Привет, спасибо. Я могу заставить его работать, когда загружаю библиотеку из <head> раздела, просто выполнив <script src="https://unpkg.com/metismenu"></script> . Но загрузка его через Webpacker выдает мне указанную выше ошибку.