vue引入jquery時報錯 $ is not defined的問題及解決
更新時間：2022年09月07日 09:39:32 作者：沃特艾文兒～
這篇文章主要介紹了vue引入jquery時報錯 $ is not defined的問題及解決，具有很好的參考價值，希望對大家有所幫助。
vue引入jquery時報錯 $ is not defined
以免日后再次遇到忘記。
安裝JQuery
npm install --save jquery
統(tǒng)一webpack版本
不同版本處理方法可能不同，我們這里就統(tǒng)一一下webpack版本
npm uninstall webpack npm install webpack@^4.0.0 --save-dev
新建配置文件
新建一個文件夾，命名為vue.config.js，這個文件是與public和src文件同級之前的版本是需要在webpack.base.conf.js里修改，新的版本沒有這個文件，我們需要建立這個文件來配置。
我們需要將以下代碼加入我們的配置文件
var webpack = require('webpack')
configureWebpack: {
? ? ? ? plugins: [
? ? ? ? ? ? new webpack.ProvidePlugin({
? ? ? ? ? ? ? ? $: "jquery",
? ? ? ? ? ? ? ? jQuery: "jquery",
? ? ? ? ? ? ? ? "windows.jQuery": "jquery"
? ? ? ? ? ? })
? ? ? ? ]
? ? }最終如下：
var webpack = require('webpack')
module.exports = {
? ? lintOnSave: false,
? ? devServer: {?
? ? ? ? proxy: {
? ? ? ? ? ? '/api': {
? ? ? ? ? ? ? ? target: 'http://localhost:8000',
? ? ? ? ? ? ? ? changeOrigin: true,
? ? ? ? ? ? ? ? ws: true,
? ? ? ? ? ? ? ? pathRewrite: {
? ? ? ? ? ? ? ? ? ? '^/api': ''
? ? ? ? ? ? ? ? }
? ? ? ? ? ? }
? ? ? ? }
? ? },
? ? configureWebpack: {
? ? ? ? plugins: [
? ? ? ? ? ? new webpack.ProvidePlugin({
? ? ? ? ? ? ? ? $: "jquery",
? ? ? ? ? ? ? ? jQuery: "jquery",
? ? ? ? ? ? ? ? "windows.jQuery": "jquery"
? ? ? ? ? ? })
? ? ? ? ]
? ? }
}vue錯誤筆記 Vue is not defined
吐槽：vue太坑了
事情的經過
我想在vue的頁面中添加一個分部視圖（PartialView），點擊button能打開一個分部視圖頁面
html代碼
<button v-on:click="create()"><span>創(chuàng)建數據</span></button>
js 代碼
然后點擊button，報錯 vue is not defined，如圖所示：
然后網上說 是vue.js的引用問題，我去檢查了下我的引用，沒毛?。?/p>
然后我把create()方法里的函數刪了，還是報錯，
所以，打開新頁面的方法應該沒出錯，可能是vue下影響了button
找到兩種解決方案
1：加上type=button:
2:給click事件加上阻止事件修飾符
原理沒懂，應該跟vue有關
以上為個人經驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
這篇文章主要介紹了vue fetch中的.then()的正確使用方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-04-04
詳談vue+webpack解決css引用圖片打包后找不到資源文件的問題
下面小編就為大家分享一篇詳談vue+webpack解決css引用圖片打包后找不到資源文件的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03
項目開發(fā)中需要做一個輪詢,所以將實現的過程記錄了一下,下面這篇文章主要給大家介紹了關于vue輪詢解決方案的相關資料,需要的朋友可以參考下2021-07-07
本篇文章主要介紹了vue.js移動端導航navigationbar的封裝，具有一定的參考價值，有興趣的可以了解一下2017-07-07
vue?button的@click方法無效鉤子函數沒有執(zhí)行問題
這篇文章主要介紹了vue?button的@click方法無效鉤子函數沒有執(zhí)行問題及解決，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-03-03
idea竟然有一個神功能很多朋友都不是特別清楚，下面小編給大家?guī)砹嗽贗DEA中Debug調試VUE項目的詳細步驟，感興趣的朋友一起看看吧2021-10-10
本篇文章主要介紹了vue實現登陸登出的實現示例，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
這篇文章主要為大家詳細介紹了Vue3實現地圖選點組件的相關知識,文中的示例代碼講解詳細,感興趣的小伙伴可以跟隨小編一起學習一下2024-01-01
這篇文章主要介紹了vue如何實現一個獲取按鍵展示快捷鍵效果的Input組件，幫助大家更好的理解和使用vue框架，感興趣的朋友可以了解下2021-01-01
這篇文章主要為大家介紹了vue封裝動態(tài)表格方式示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-08-08