Как добавить bootstrap js на сайт Gatsby

Question

Я настраивался в Гэтсби, и он, безусловно, обеспечивает бесперебойную работу статических сайтов.У меня есть стек, где мне нужно проектировать макеты с помощью начальной загрузки, поскольку макеты заинтересованы в начальной загрузке, но для дополнительной поддержки, такой как выпадающий карусель или модальный режим, я должен использовать bootstrap.js и его зависимости, хотя в локальной среде все работает нормально, но когда яразвертывание моего веб-сайта наше netlify Я сталкиваюсь с этой проблемой

4:25:02 PM: failed during stage 'building site': Build script returned non-zero exit code: 1
4:25:01 PM:   7 | //# sourceMappingURL=bootstrap.min.js.map
4:25:01 PM: 
4:25:01 PM:   WebpackError: TypeError: Cannot set property 'emulateTransitionEnd' of undefin  ed
4:25:01 PM:   
4:25:01 PM:   - bootstrap.min.js:6 
4:25:01 PM:     [lib]/[bootstrap]/dist/js/bootstrap.min.js:6:2564
4:25:01 PM:   
4:25:01 PM:   - bootstrap.min.js:6 ./node_modules/bootstrap/dist/js/bootstrap.min.js
4:25:02 PM: Shutting down logging, 58 messages pending 

После дальнейшего изучения этой проблемы в официальном репо и в Google большинство людей рекомендуют реагировать на начальную загрузку или реактивный ремень, но я очень привязан к начальной загрузке и не могучтобы найти правильное решение для вышеуказанной ошибки, есть ли в любом случае или лучший способ включить загрузчик JS?Вот мой файл package.json.

"dependencies": {
    "bootstrap": "^4.3.1",
    "gatsby": "^2.8.2",
    "gatsby-image": "^2.1.2",
    "gatsby-plugin-manifest": "^2.1.1",
    "gatsby-plugin-offline": "^2.1.1",
    "gatsby-plugin-react-helmet": "^3.0.12",
    "gatsby-plugin-react-svg": "^2.1.1",
    "gatsby-plugin-sass": "^2.0.11",
    "gatsby-plugin-sharp": "^2.1.3",
    "gatsby-source-filesystem": "^2.0.38",
    "gatsby-transformer-sharp": "^2.1.21",
    "jquery": "^3.4.1",
    "node-sass": "^4.12.0",
    "popper.js": "^1.15.0",
    "prop-types": "^15.7.2",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-helmet": "^5.2.1"
  },
  "devDependencies": {
    "prettier": "^1.17.1"
  },

Заранее спасибо!

Answer 1

OK исправил это, добавив мои зависимости при загрузке в gatsby-browser.js

, вот как я добавил

import './src/sass/app.scss'
import 'jquery/dist/jquery.min.js'
import 'popper.js/dist/popper.min'
import 'bootstrap/dist/js/bootstrap.min.js'

app.scss - это файл, в который я импортировал компоненты начальной загрузки пос моими пользовательскими стилями.

В качестве альтернативы, вы можете использовать response-bootstrap, который удаляет ненужную зависимость jQuery для bootstrap, но использует стили начальной загрузки для стиля своего собственного компонента.