如何在 Vue 和 Laravel 中集成实现 JS

Question

我试图要求在 Vue 和 Laravel 中实现

在bootstrap.js我有

window.Materialize = require('materialize-css');

在我拥有App.vue组件中

mounted(){
  Materialize.toast('I am a toast!', 4000)
}

并收到

"未捕获的引用错误：未定义具体化"

消息。

Answer 1

要么删除带有 materialize js 的脚本标记，要么确保在要求 Materialize 之前加载 jquery。我想你有一个浏览器化设置，如果你这样做，你可以做这样的事情：

require('jquery')(window);
require('materialize-css')(window); 

或类似的东西：

global.jQuery = require('jquery')
global.Materialize = require('materialize-css')

或者只全局导入 jQuery，然后简单地var Materialize=require('materialize-css')并使用变量。

对于 webpack 设置，为您通过 npm 安装并全局需要的东西添加一个插件：

  plugins:[
   new webpack.ProvidePlugin({
   $: "jquery",
   jQuery:'jquery',
   jquery:'jquery'
 }),
],