注:vue-cli3.0 沒有了 webpack.config.js 配置文件,取而代之的是集合在 vue.config.js文件 內進行配置
默認已經安裝好vue-cli3.0項目
step1:命令行工具,進入項目文件夾,執行: npm install jquery --save
step2:提示安裝成功后,在package.json 文件內的 "dependencies"中檢查是否有 "jquery": "^3.3.1", (如沒有 則需手動添加):
step3:.eslintrc.js 文件中,env 中 添加 jquery:true
step4:【關鍵步驟】
vue.config.js 文件中:最頭部添加 “const webpack = require('webpack')”;module.exports中,添加:
configureWebpack: {
plugins: [
new webpack.ProvidePlugin({
$:"jquery",
jQuery:"jquery",
"windows.jQuery":"jquery"
})
]
}
step5:main.js中 引入 “import $ from 'jquery'”
step6:重新啟動vue-cli,頁面組件中 script標簽加如下測試代碼,頁面能彈出則成功