如何使用 webpacker/Rails 要求 select2？

Question

我一直在通过 CDN 使用 select2。我开始将 CDN 迁移到使用 webpacker gem。我偶然发现了一个困难，我无法导入/要求或以任何方式包含它。所以这是我的设置：

我已经通过以下步骤迁移了 select2：

• 纱线添加选择2

下面是我的 environment.js 文件（这是配置文件，webpacker 用来配置 webpack）：

const { environment } = require('@rails/webpacker')
const webpack = require('webpack')
environment.plugins.append(
    'Provide',
    new webpack.ProvidePlugin({
        $: 'jquery/src/jquery',
        jQuery: 'jquery/src/jquery',
        Popper: ['popper.js', 'default']
    })
)
module.exports = environment

环境.js

require("select2")

我尝试了各种要求和许多其他方法，但这些似乎都不起作用。请指教。谢谢你。

Answer 1

这是我要检查的内容：

1. 根据项目 README，在 Rails 项目中正确安装 Webpacker。如果您从 Rails 6 应用程序开始，这将默认完成。

2. 添加jquery和select2：

   yarn add jquery select2 
   

3. 向 DOM 添加一个选择框

   yarn add jquery select2 
   

4. 导入 jquery、select2 和 select2 css 并在页面加载时应用于选择框：

   <select class="js-states" name="state">
     <option value="AL">Alabama</option>
     ...
     <option value="WY">Wyoming</option>
   </select>
   

5. 对于开发，设置compile: true在config/webpacker.yml. 运行webpack-dev-server是可选的。

这些是我创建这个演示所采取的步骤：https : //github.com/rossta/rails6-webpacker-demo/compare/example/select2