vue-cli安装的vue项目中引用jquery

1. 安装jquery

  npm install jquery --save

2. 或是在package.json指定jq版本号后,运行npm install命令,安装指定版本的jquery

"dependencies": {
    "core-js": "^3.3.2",
    "jquery": "^3.4.1",
    "qrcodejs2": "0.0.2",
    "vue": "^2.6.10",
    "vue-router": "^3.1.3",
    "vuex": "^3.0.1"
  },

3. 根目录下新建vue.config.js,并配置

const webpack = require('webpack');

module.exports = {
    configureWebpack: {//引入jquery
        plugins: [
            new webpack.ProvidePlugin({
                $: "jquery",
                jQuery: "jquery",
                "windows.jQuery": "jquery"
            })
        ]
    },
    
}

这样,便可在vue项目中使用jquery了。

说到这里也顺便提一下,我们设置代理也是在vue.config.js中添加的,代码如下

const webpack = require('webpack');

module.exports = {
    configureWebpack: {//引入jquery
        plugins: [
            new webpack.ProvidePlugin({
                $: "jquery",
                jQuery: "jquery",
                "windows.jQuery": "jquery"
            })
        ]
    },
    devServer: {
        port: 8089,
        proxy: "http://localhost:8080",
        // proxy:{
        //   '/': {
        //     target: 'http://localhost:8080/',
        //     changeOrigin: true,
        //     pathRewrite: {}
        //   },
        // }
    },
}

文章转自:https://www.cnblogs.com/qlongbg/articles/11751980.html

感谢作者的分享。

你可能感兴趣的:(Vue,JQuery,vue,js)