Webpacker: How to import bootstrap

[pioz]

I'm trying to import bootstrap in my pack.

• I've added bootstrap with yarn:
  yarn add bootstrap@3
• In my layout I've added the line
  <%= javascript_pack_tag 'backoffice' %> <%= stylesheet_pack_tag 'backoffice' %>
• I've my pack pack/backoffice.js that import bootstrap:
  import 'bootstrap/dist/js/bootstrap' import '../backoffice/stylesheets/backoffice.scss'
• the file '../backoffice/stylesheets/backoffice.scss' import bootstrap.css
  @import '~bootstrap/dist/css/bootstrap';
  In this way I get the follow error:

Failed to compile.

./app/javascript/backoffice/stylesheets/backoffice.scss
Module build failed: ModuleNotFoundError: Module not found: Error: Can't resolve '../fonts/glyphicons-halflings-regular.eot' in '/Users/pioz/Code/valoritalia/app/javascript/backoffice/stylesheets'
    at factoryCallback (/Users/pioz/Code/valoritalia/node_modules/webpack/lib/Compilation.js:276:40)
    at factory (/Users/pioz/Code/valoritalia/node_modules/webpack/lib/NormalModuleFactory.js:237:20)
    at resolver (/Users/pioz/Code/valoritalia/node_modules/webpack/lib/NormalModuleFactory.js:60:20)
    at asyncLib.parallel (/Users/pioz/Code/valoritalia/node_modules/webpack/lib/NormalModuleFactory.js:127:20)
    at /Users/pioz/Code/valoritalia/node_modules/async/dist/async.js:3874:9
    at /Users/pioz/Code/valoritalia/node_modules/async/dist/async.js:473:16
    at iteratorCallback (/Users/pioz/Code/valoritalia/node_modules/async/dist/async.js:1048:13)
    at /Users/pioz/Code/valoritalia/node_modules/async/dist/async.js:958:16
    at /Users/pioz/Code/valoritalia/node_modules/async/dist/async.js:3871:13
    at resolvers.normal.resolve (/Users/pioz/Code/valoritalia/node_modules/webpack/lib/NormalModuleFactory.js:119:22)
 @ ./app/javascript/packs/backoffice.js 13:0-51
 @ multi (webpack)-dev-server/client?http://localhost:3035 ./app/javascript/packs/backoffice.js

Any idea how to import Bootstrap 3 with webpacker without sprockets?

[gregnavis]

I followed the recommendation on #1119 and added resolve-url-loader and that helped in my case.

[pioz]

Ok, this solve the issue...

[westonplatter]

I found @gregnavis's comment super helpful. His solution worked for me (even a couple of node years later).