首页 > 解决方案 > 无法通过 webpacker 应用程序在我的 Rails 上使用引导导航栏

问题描述

嗨,我正在使用带有 ruby​​ on rails 的 webpacker 运行我的应用程序。我试图弄清楚为什么我使用的导航栏没有打开。它总是没有样式。如图所示: 在此处输入图像描述

我从这里使用导航栏

这是我的environment.js文件webpacker:我已经bootstrap使用yarn.

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

const path = require('path')

environment.use = [
  {
            loader: 'sass-loader',
            options: {
              "includePaths": [
                path.resolve(__dirname, 'node_modules'),
                path.resolve(__dirname, 'src')
              ]
            }
          },{
            loader: 'resolve-url-loader',
            options: {
              attempts: 1
            }
          }
]

environment.plugins.prepend(
  'Provide',
  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    jquery: 'jquery',
    'window.jQuery': "jquery",
    Tether: 'tether',
    Popper: ['popper.js', 'default']
  })
)

module.exports = environment;

我可以让 jquery 在我的应用程序上运行。但引导程序没有加载到我的应用程序中。以及如何在任何地方都不需要它的情况下使用 bootstrap global?可能吗?如果没有,我将如何在一个地方需要它并在任何地方使用它?是application.js存档吗?

我看到我正在使用的导航栏始终被视为移动视图。该类navbar-toggle collapse应该处于崩溃状态,但它拥有的类是navbar-toggle collapsed. 在网络视图上时也是如此。并且navbar-collapse collapsed在 web 视图上使用的类应该是collapsed,但它有类collapse。从开发人员控制台手动更改类后。我发现了这个视图(没有样式): 在此处输入图像描述

标签: ruby-on-railstwitter-bootstrapwebpackwebpacker

解决方案


推荐阅读