javascript - Rails 6：通过 Webpacker 包含 3rd Party Yarn 库

Question

我将 jQuery 添加到 Webpack 中，它似乎可以工作。

我试图添加一个名为“Swiper”的 JS 库，但我只是不知道如何包含它。

这是我所做的：

yarn add swiper（成功）

环境.js：

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

const webpack = require('webpack')
environment.plugins.prepend('Provide',
  new webpack.ProvidePlugin({
    $: 'jquery/src/jquery',
    jQuery: 'jquery/src/jquery',
    Swiper: 'swiper'
  })
)

module.exports = environment

应用程序.js：

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

import 'Swiper';

在我的控制台中，我得到：

未捕获的错误：找不到模块“Swiper”

未捕获的 ReferenceError：未定义 Swiper

额外的问题：我怎么能只在特定视图上包含 Swiper JS？例如我只需要它gallery.html.erb

标签： javascriptruby-on-railswebpack

Answer 1

在你的application.js：

import Swiper from 'swiper'
window.Swiper = Swiper

我认为没有必要把它放在你的environment.js