vue+webpack與jquery插件的那些淺坑

jquery的引入

既然是jquery插件，那麼必定是依賴JQuery啦，下載jquery

npm install --save jquery

接着，在咱們的webpack.base.config文件跟對象下添加如下代碼

plugins: [
            new webpack.ProvidePlugin({
                $: "jquery",
                jQuery: "jquery",
                "windows.jQuery": "jquery"
            })
        ]

---

jquery-ui的使用

jquery-ui這裏是一個超級大坑，我在這裏跌倒了，費好大勁爬起來。
咱們把包下載下來

npm install --save jquery-ui

咱們先試試這樣寫，引入咱們的jquery-ui

import 'jquery-ui'

而後咱們從新運行項目

---

我有一個依託於jquery-ui的插件，由於沒找到jquery-ui,它不開心，給咱們報了好多錯誤，還要我下載jquery-ui，明明已經下好了，那麼是引入哪裏出了問題！把import刪掉，在webpack.base.config中更改一下代碼、

alias: {
            'jquery-ui': path.resolve('./node_modules/jquery-ui/ui'),
            'vue$': 'vue/dist/vue.esm.js',
            '@': resolve('src')
        }

從新運行下咱們的項目

成功了！警告咱們先不去管他~同事的鍋。

---

普通插件的引入

我此次用的jquery插件是gridstack,正常引入npmbao都是import "gridstack"或者require(gridstack),文件讓webpack本身去找嘛，我都設置好了,我用親身經歷告訴你：不行！！！把全部插件放進一個plug-ui的文件夾吧，而後手動填寫路徑。

import utilcss from '../../plug-in/gridstack/dist/gridstack.css'
import util from '../../plug-in/gridstack/dist/gridstack.js'

插件到此引入成功！都是些小錯誤，可是網上沒有很詳細的代碼，在此但願幫到你們。
貼上這個拖拽插件的連接：https://github.com/troolee/gr...