title: Can't load owl-carousel with webpack 4
body: <p>I followed the instructions in the <a href="https://github.com/OwlCarousel2/OwlCarousel2/blob/develop/README.md" rel="nofollow noreferrer">readme</a> to install owl:</p>
  
  <pre><code>npm install owl-carousel --save-dev
  </code></pre>
  
  <p>Included this in the plugins section of webpack.config.js:</p>
  
  <pre><code>new webpack.ProvidePlugin({
      $: "jquery",
      jQuery: "jquery",
      "window.jQuery": "jquery"
  }),
  </code></pre>
  
  <p>and added this to my entry file (index.js)</p>
  
  <pre><code>import "jquery";
  import "bootstrap";
  import "owl.carousel";
  </code></pre>
  
  <p>but it's not finding it.  when I try to build I get:</p>
  
  <pre><code>ERROR in ./src/index.js
  Module not found: Error: Can't resolve 'owl.carousel' in '/Volumes/Home/Sites/mysite/src'
   @ ./src/index.js 19:0-23
   @ multi ./src/index.js
  </code></pre>
  
  <p>I also tried <code>import "owl-carousel";</code> with the same result.  It's loading jquery and bootstrap, which are also node modules so I don't think it's a resolving issue.</p>
  
  <p>I am using webpack 4</p>
  
  <p>UPDATE here is my webpack.config.js</p>
  
  <pre><code>// webpack v4
  //process.traceDeprecation = true
  const webpack = require('webpack');
  const path = require('path');
  const glob = require('glob-all');
  const assets = path.resolve(__dirname, 'flask_app/static');
  const templates = path.resolve(__dirname, 'flask_app/templates');
  
  const { getIfUtils,removeEmpty } = require('webpack-config-utils');
  const PurgecssPlugin = require('purgecss-webpack-plugin');
  const HtmlWebpackPlugin = require('html-webpack-plugin');
  const MiniCssExtractPlugin = require("mini-css-extract-plugin");
  const CleanWebpackPlugin = require('clean-webpack-plugin');
  const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
  const CopyWebpackPlugin = require('copy-webpack-plugin');
  const StyleLintPlugin = require('stylelint-webpack-plugin');
  const VueLoaderPlugin = require('vue-loader/lib/plugin');
  
  const { ifProduction, ifNotProduction } = getIfUtils(process.argv[3]);
  
  console.log("IFPRODUCTION", ifProduction());
  console.log("IFNOTPRODUCTION", ifNotProduction());
  
  module.exports = (env, argv) =&gt; {
  
      const devMode = argv.mode !== 'production';
      console.log("DEVMODE", devMode);
  
      return {
          watch: false,
  
          entry: [
              './src/index.js'
          ],
          output: {
              path: assets,
              filename: '[name].[chunkhash].js'
          },
          module: {
              rules: [{
                      test: /\.vue$/,
                      loader: 'vue-loader'
                  },
                  {
                      test: /\.js$/,
                      enforce: 'pre',
  
                      use: [{
                              loader: 'eslint-loader',
                              options: {
                                  emitWarning: true,
                              }
                          },
                          {
                              loader: "babel-loader",
                              options: {
                    presets: [
                      ['env']
                      ]
                                  }
                          }
                      ]
                  },
                  // {
                  //  test: /\.min\.js$/,
                  //   loader: 'imports-loader?jQuery=jquery,$=jquery,this=&gt;window'
                  // },
                  {
                      test: /\.s?[ac]ss$/,
                      use: [{
                              loader: MiniCssExtractPlugin.loader
                          },
                          {
                              loader: 'css-loader',
                              options: {
                                  //url: false,
                                  sourceMap: ifNotProduction(),
                              },
                          },
                          {
                              loader: 'postcss-loader',
                              options: {
                                  ident: 'postcss',
                                  sourceMap: ifNotProduction(),
                                  plugins: () =&gt;
                                      ifProduction([
                                          require('autoprefixer')({
                                              preset: 'default',
                                          }),
                                          require('cssnano'),
                                          require("css-mqpacker")
                                      ], [
                                          require('autoprefixer')({
                                              preset: 'default',
                                          }),
                                          require("css-mqpacker")
                                      ])
                              }
                          },
                          {
                              loader: 'sass-loader',
                              options: {
                                  sourceMap: ifNotProduction(),
                              },
                          }
                      ],
                  },
                  {
              test: /\.(png|jpg|gif)$/,
              use: [
                {
                  loader: 'url-loader',
                  options: {
                    limit: 8192
                  }
                }
              ]
            },
                  {
                      test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
                      use: [{
                          loader: 'file-loader',
                          options: {
                              name: '[name].[ext]',
                              outputPath: 'fonts/'
                          }
                      }]
                  }
              ]
          },
  
          optimization: {
              minimizer: [
                  new UglifyJSPlugin({
                      uglifyOptions: {
                          sourceMap: ifNotProduction(),
                          compress: {
                              drop_console: true
                          }
                      }
                  })
              ]
          },
          plugins: removeEmpty([
              new webpack.ProvidePlugin({
                  $: "jquery",
                  jQuery: "jquery",
                  "window.jQuery": "jquery"
              }),
              new VueLoaderPlugin(),
              new CleanWebpackPlugin('flask_app/static', {}),
              new MiniCssExtractPlugin({
                  filename: devMode ? 'style.css' : 'style.[chunkhash].css',
              }),
              new HtmlWebpackPlugin({
                  hash: true,
                  template: './src/store_layout.html.j2',
                  filename: `${templates}/store_layout.html.j2`
              }),
              ifProduction(new PurgecssPlugin({
                  paths: glob.sync([
                      path.join(__dirname, 'src/*.html'),
                      path.join(__dirname, 'src/*.html.j2'),
                      path.join(__dirname, 'src/site/*.html'),
                      path.join(__dirname, 'src/site/*.html.j2'),
                      path.join(__dirname, 'src/*.js')
                  ]),
              })),
              new CopyWebpackPlugin([{
                  from: 'src/img',
                  to: 'img'
              }]),
              new CopyWebpackPlugin([{
                  from: 'src/site',
                  to: `${templates}/site`
              }]),
              new StyleLintPlugin({
                  configFile: '.stylelintrc',
                  context: './src',
                  files: '**/*.s?[ac]ss',
                  failOnError: true
              })
          ])
      }
  };
  </code></pre>