Не может требовать Popper с Webpack

Я пытаюсь переместить свои файлы javascript в Webpack. Я не очень хорошо знаком с Webpack, поэтому не уверен, что правильно написал что-либо из этого. Я пытаюсь загрузить jquery-ui, popper и bootstrap 4. Однако я получаю сообщение об ошибке, когда требую Popper. Обратите внимание, что я использую гем Wepacker для Ruby on Rails.

Я включил следующий код в свой файл environment.js, чтобы автоматически включать jQuery в каждый файл.

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

const webpack = require('webpack')
environment.plugins.append('Provide', new webpack.ProvidePlugin({
  $: 'jquery',
  jQuery: 'jquery'
}))

module.exports = environment

Эта часть работает. Итак, оттуда я побежал yarn add jquery-ui.

Затем в свой файл /pack/application.js я включил require('jquery-ui').

Из моего файла js на мою консоль выводится следующий код:

$(document).ready(function(){
    if (jQuery.ui) {
      console.log("loaded");
    }
});

После этого я попытался установить и потребовать popper с yarn add popper.

Затем вызывая popper изнутри моей document.ready функции, я получаю сообщение об ошибке:

$(document).ready(function(){

    console.log(window.Popper)

});

Ошибка:

Uncaught Error: Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: /home/ubuntu/environment/node_modules/path-platform/path.js: 'return' outside of function (32:2)

  30 | if (_path.posix) {
  31 |   module.exports = _path;
  32 |   return;
     |   ^
  33 | }
  34 | 
  35 | // resolves . and .. elements in a path array with directory names there
    at Parser.raise (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:6420)
    at Parser.parseReturnStatement 
(home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10370)
    at Parser.parseStatementContent 
(home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10057)
    at Parser.parseStatement (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10009)
    at Parser.parseBlockOrModuleBlockBody 
(home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10585)
    at Parser.parseBlockBody (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10572)
    at Parser.parseBlock (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10556)
    at Parser.parseStatementContent 
    (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10085)
    at Parser.parseStatement (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10009)
    at Parser.parseIfStatement 
    (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10363)
    at Parser.parseStatementContent 
    (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10054)
    at Parser.parseStatement (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10009)
    at Parser.parseBlockOrModuleBlockBody 
    (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10585)
at Parser.parseBlockBody (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:10572)
at Parser.parseTopLevel (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:9940)
at Parser.parse (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:11447)
at parse (home/ubuntu/environment/node_modules/@babel/parser/lib/index.js:11483)
at parser (home/ubuntu/environment/node_modules/@babel/core/lib/transformation/normalize-file.js:168)
at normalizeFile (home/ubuntu/environment/node_modules/@babel/core/lib/transformation/normalize-file.js:102)
at runSync (home/ubuntu/environment/node_modules/@babel/core/lib/transformation/index.js:44)
at runAsync (home/ubuntu/environment/node_modules/@babel/core/lib/transformation/index.js:35)
at process.nextTick (home/ubuntu/environment/node_modules/@babel/core/lib/transform.js:34)
at process._tickCallback (internal/process/next_tick.js:61)
at Object../node_modules/path-platform/path.js (index.js:82)
at __webpack_require__ (bootstrap:19)
at Object.<anonymous> (index.js:1)
at Object../node_modules/parents/index.js (index.js:39)
at __webpack_require__ (bootstrap:19)
at Object.<anonymous> (index.js:19)
at Object../node_modules/module-deps/index.js (index.js:623)
at __webpack_require__ (bootstrap:19)
at Object.<anonymous> (index.js:3)
at Object../node_modules/browserify/index.js (index.js:846)

Вот мой файл pack / application.js

require("@rails/ujs").start()
require("@rails/activestorage").start()

require('jquery-ui')
require('popper')

person Cannon Moyer    schedule 18.10.2019    source источник


Ответы (1)


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

Итак, чтобы исправить это, вам нужно:

yarn remove popper
yarn add popper.js
person Andrew Evans    schedule 28.11.2019