webpack2 引入 jquery

我想问下 webpack 怎么引入 第三方插件呀,如 jquery
在网上找了好多方法,但给我报各种错,没办法了来这儿问问,有大神会吗

我的 webpack 配置

const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
    entry:{
        e:'./src/js/e.js',
        name:'./src/js/name.js',
        conduct:'./src/js/conduct.js',
        swiper:'./src/js/swiper.min.js'
    },
    output:{
        path:path.resolve(__dirname, "dist"),
        filename:'./src/js/[name].js'
    },
    devtool:'source-map',
    module:{
        rules:[
            {
                test:require.resolve('jquery'),
                use:[{
                    loader:'expose-loader',
                    options:"$"
                }]
            },
            {
                test:/\.css$/,
                loader:'style-loader!css-loader?minimize'
            },
            {
                test:/\.scss$/,
                loader:'style-loader!css-loader!sass-loader'
            }
            ,
            {
                test:/\.js$/,
                exclude: /(node_modules)/,
                loader:'babel-loader'
            }
        ]
    },
    plugins:[
        new webpack.ProvidePlugin({
            $:'jquery',
            jQuery:'jquery'
        })
    ],
    devServer:{
        contentBase:path.join(__dirname,"src"),
        // hot:true,
        // progress:true,
        inline:true
    }
}

报错信息:
图片描述

阅读 3.3k
2 个回答

`externals里面配置,在模板上直接引入第三方CDN资源

externals: {
    jquery: "jQuery",
},

npm安个expose-loader
webpack

 rules: [{
          test: require.resolve('jquery'),
          use: [{
              loader: 'expose-loader',
              options: 'jQuery'
          },{
              loader: 'expose-loader',
              options: '$'
          }]
      }]

jq引入 require("expose-loader?$!jquery");
当然你这个也是可以引入的,只不过是全局引入
在main.js里加上

import $ from 'jquery';   
window.$ = $;
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题