Handsontableを使用したJavascriptプロジェクトでインポート時にモジュールが見つかりません

Question

WebpackでコンパイルされたVueJSプロジェクトにHandsontable seetsコンポーネントを使用しようとしています。しかし、私はモジュールでnumbroをインポートできなくても発生する 'モジュールnumbroを見つけることができません'というエラーが表示されています。ここで述べたように

"dependencies": { 
    "vue": "^2.1.10", 
    "handsontable": "^0.31.1", 
    "moment": "^2.18.1", 
    "numbro": "^1.10.1", 
    "pikaday": "^1.5.1", 
    "vue-handsontable": "^0.0.2", 
    "zeroclipboard": "^2.3.0" 
}, 

：私は

npm install 

package.jsonを使用して、以下のpackage.jsonに応じてすべてのパッケージをインストールしているhttps://github.com/handsontable/handsontable/issues/3407私はのモジュールローダーセクションにHandsontableの4つの依存関係を追加しましたwebpack設定ファイル。

Error: Cannot find module 'numbro' 

私が見ることができます：私はコンパイルして、私は、コンソールのエラーを取得する私のVueJSプロジェクトを実行

webpack.config.js

module: { 
loaders: [ 
    { 
    test: require.resolve('numbro'), 
    loader: 'expose?numbro' 
    }, 
    { 
    test: require.resolve('moment'), 
    loader: 'expose?moment' 
    }, 
    { 
    test: require.resolve('pikaday'), 
    loader: 'expose?Pikaday' 
    }, 
    { 
    test: require.resolve('zeroclipboard'), 
    loader: 'expose?ZeroClipboard' 
    }] 

TableView.vue

<template> 
     <div id="hot-preview"> 
      <cool-table :data="data" :settings="{}"></cool-table> 
     </div> 
    </div> 
</template> 

<script> 
import moment from 'moment' 
import numbro from 'numbro' 
import pikaday from 'pikaday' 
import Zeroclipboard from 'zeroclipboard' 
import Handsontable from 'handsontable' 
import CoolTable from 'vue-handsontable' 

export default { 
    name: 'TablesView', 
    data() { 
    return { 
     data: [ 
     ['', 'Kia', 'Nissan', 'Toyota', 'Honda'], 
     ['2008', 10, 11, 12, 13], 
     ['2009', 20, 11, 14, 13], 
     ['2010', 30, 15, 12, 13] 
     ] 
    } 
    }, 
    components: { 
    CoolTable 
    } 
} 
</script> 

node_modulesフォルダー内のnumbro.jsを含むnumbroフォルダー。何が間違っている可能性があるかに関する任意のアイデア？ Handsontableを動作させるために

Answer 1

私は公開-ローダーを使用するwebpack.config.jsを変更：

loader: 'expose-loader?numbro' 

その後、私は公開ローダー

npm install expose-loader