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

解决方法

我能说的是这段代码在metisMenu完全加载之前就可以工作了。没有看到您的配置就无法产生解决方案。