vuecli 3.0グローバル導入jquery
1229 ワード
以前はjqueryを使用していたが、各コンポーネントが導入された.
この方法はjqueryを使用するコンポーネントごとに導入する必要があります.面倒ですが、グローバル導入の方法を共有します.
1.jqueryのダウンロード
2.vue.configureWebpack jqueryプラグインの追加
vuecli 3でwebpack構成を変更する
3.package.jsonでeslint構成項目envに「jquery」:trueを追加
Eslint構成
4.最後に、プロジェクトの各コンポーネントでimportを使わずにjqueryを使用することができます.
import $ from 'jquery'
この方法はjqueryを使用するコンポーネントごとに導入する必要があります.面倒ですが、グローバル導入の方法を共有します.
1.jqueryのダウンロード
npm install jquery
2.vue.configureWebpack jqueryプラグインの追加
vuecli 3でwebpack構成を変更する
const webpack = require("webpack");
module.exports = {
configureWebpack: {
// jquery
plugins: [
new webpack.ProvidePlugin({
$:"jquery",
jQuery:"jquery",
"windows.jQuery":"jquery"
})
]
},
};
3.package.jsonでeslint構成項目envに「jquery」:trueを追加
Eslint構成
"eslintConfig": {
"root": true,
"env": {
"node": true,
"jquery": true // jquery,
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"rules": {
"no-console": "off"
},
"parserOptions": {
"parser": "babel-eslint"
}
},
4.最後に、プロジェクトの各コンポーネントでimportを使わずにjqueryを使用することができます.