Webpack ES6モジュール - fancyBox/tagsInputは関数ライブラリのインポートではありません。

Question

2つのライブラリfancyBoxとtagsInputを読み込み、両方ともJqueryに依存するwebpackバンドルes6モジュールにロードしようとしています。 myFile.jsで

、私は..次のように次

import $ from 'jquery'; 

import './../..vendor/jquery.fancybox.js'; 

マイファイル構造である必要があり

/node_modules 
/frontend 
    index.js 
    /components 
     /myFolder 
     myFile.js 
    /vendor 
     jquery.fancybox.js 

しかし、私は次のエラーに

Uncaught TypeError: (0 , _jquery2.default)(...).fancybox is not a function 

を取得していますだから、fancyboxはjqueryオブジェクトに自分自身を添付することができないようですか？私は以下の私のWebPACKの設定でインポートローダーを使用してこれを是正しようとしています。..

const webpack = require('webpack'); 
const path = require('path'); 
const precss = require('precss'); 
const autoprefixer = require('autoprefixer'); 
const ExtractTextPlugin = require('extract-text-webpack-plugin'); 
const postcssImport = require('postcss-import'); 

module.exports = { 

    context: __dirname + '/frontend', 
    devtool: 'source-map', 
    entry: { 
    app: './index.js', 
    }, 
    output: { 
    filename: 'bundle.js', 
    path: path.join(__dirname, './static'), 
    }, 
    module: { 
    loaders: [ 
    { test: /\.js$/, loader: 'babel', exclude: /node_modules/, query: { presets: ['es2015'] } }, 
    { test: /\.css$/, loader: ExtractTextPlugin.extract('style', 'css?sourceMap&importLoaders=1!postcss') }, 
    { test: /[\/\\]node_modules[\/\\]some-module[\/\\]index\.js$/, loader: 'imports?this=>window' }, 
    { test: /vendor\/.+\.(jsx|js)$/, loader: 'imports?jQuery=jquery,$=jquery,this=>window' }, 
    ], 
    }, 
    plugins: [ 
    new ExtractTextPlugin('si-styles.css'), 
    ], 
    postcss: function(webpack) { 
    return [ 
     postcssImport({ addDependencyTo: webpack }), // Must be first item in list 
     precss, 
     autoprefixer({ browsers: ['last 2 versions'] }), 
    ]; 
    }, 

}; 

この上の任意のアイデアは感謝して受信されるだろう。

Answer 1

私のwebpack.config.jsにwebpack.ProvidePluginを使用してjqueryを提供し、myFileから 'import jquery'を削除するとこれが修正されたようです。

new webpack.ProvidePlugin({ 
     $: "jquery", 
     jQuery: "jquery", 
    })