vuejs webpack cliプロジェクトにjqueryを含めるにはどうすればいいですか？

Question

こんにちは、私はプロジェクトを生成するためにvuejs cliを使っていました（https://github.com/vuejs/vue-cli）。 cliはwebpackとimを使用して、vueファイル内のjqueryを使用するのに問題があります。私はいつも。

http://eslint.org/docs/rules/no-undef '$' is not defined 

私は次のようにプラグインのブロックを提供含めるように私のwebpack.dev.configを編集しようとしている：

var utils = require('./utils') 
var webpack = require('webpack') 
var config = require('../config') 
var merge = require('webpack-merge') 
var baseWebpackConfig = require('./webpack.base.conf') 
var HtmlWebpackPlugin = require('html-webpack-plugin') 
var FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') 

// add hot-reload related code to entry chunks 
Object.keys(baseWebpackConfig.entry).forEach(function (name) { 
    baseWebpackConfig.entry[name] = ['./build/dev-client'].concat(baseWebpackConfig.entry[name]) 
}) 

module.exports = merge(baseWebpackConfig, { 
    module: { 
    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap }) 
    }, 
    // cheap-module-eval-source-map is faster for development 
    devtool: '#cheap-module-eval-source-map', 
    plugins: [ 
    new webpack.DefinePlugin({ 
     'process.env': config.dev.env 
    }), 
    // https://github.com/glenjamin/webpack-hot-middleware#installation--usage 
    new webpack.HotModuleReplacementPlugin(), 
    new webpack.NoEmitOnErrorsPlugin(), 
    // https://github.com/ampedandwired/html-webpack-plugin 
    new HtmlWebpackPlugin({ 
     filename: 'index.html', 
     template: 'index.html', 
     inject: true 
    }), 
    new FriendlyErrorsPlugin(), 
    new webpack.ProvidePlugin({ 
     $ : "jquery", 
     jQuery : "jquery" 
    }) 
    ] 
}) 

をしかし、私は再び同じ問題の時間と時間に実行jqueryのを使用しようとすると。私は本当にちょうど私は何を試してもjqueryを含めると思うこれを得るためにcdnを使用することに反対していない。

VUEファイルが役に立つ場合

は、その私は、スクリプトブロック

<script> 
export default { 
    name: 'how_can_we_help_you', 
    data() { 
    return { 
     msg: 'Welcome to Your Vue.js App' 
    } 
    } 
} 
console.log($) 
</script> 

助けてくださいイム非常に立ち往生し、今ではかなり誘い込むために、この問題を解決しようとしている内部のように$をCONSOLE.LOGしてみてください。前もって感謝します。

Answer 1

を行います。そのeslintrc.js

これを以下に追加して、提供プラグインを修正します。

env: { 
    browser: true, 
    jquery: true 
}, 

Answer 2

は、main.jsに行くと検索の2日後

window.$ = window.jQuery = require('jquery') 

または

Vue.use({ 
    install: function(Vue, options){ 
     Vue.prototype.$jQuery = require('jquery'); // you'll have this.$jQuery anywhere in your vue project 
    } 
}) 

Answer 3

解決策が見つかりました。 webpack.dev.configではなくwebpack.dev.conf.jsに変更を加え、eslintrc.jsではなくeslintrc.jsonに変更を加えました。