Jquery + webpack4问题

Question

我试图谷歌这个主题解决方案，但他们都是旧的webpack或不工作的解决方案。在webpack网站上也没有帮助。请帮忙 Here is the error

webpack.config.js

const webpack = require('webpack');
const path = require('path');
module.exports = {
  entry: {
    'bundle.js': [
     path.resolve(__dirname, 'js/back-to-top.js')
    ]
 },
 output: {
    filename: '[name]',
    path: path.resolve(__dirname, 'dist'),
 },
 module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        }
      }
    ]
  },
  plugins: [
    new webpack.ProvidePlugin({
      $: 'jquery',
      jQuery: 'jquery',
      "window.jQuery": "jquery",
    })
  ]
};

后端到top.js

$(document).ready(function(){
  //Back to top
  $(window).scroll(function () {
    if ($(this).scrollTop() > 50) {
      $('#back-to-top').fadeIn();
    } else {
      $('#back-to-top').fadeOut();
    }
  });
  // scroll body to 0px on click
  $('#back-to-top').click(function () {
    $('#back-to-top').tooltip('hide');
    $('body,html').animate({
      scrollTop: 0
    }, 800);
    return false;
  });
  $('#back-to-top').tooltip('show');
});

package.json

Answer 1

看起来.tooltip是一个jQuery插件，您是否import编辑了它？ 如果是这样，请确保在给定代码运行之前导入它。

Answer 2

我发现解决方案不是在插件中添加ProvidePlugin，而是使用它来代替

externals: {
      jquery: 'jQuery'
  }

https://webpack.js.org/configuration/externals/