0
我正在嘗試使用用Webpack編譯的VueJS項目的Handsontable seets組件。但是我得到'無法找到模塊numbro'錯誤,即使我不在模塊中導入numbro,也會發生這種錯誤。我照着下面使用使用Handsontable的Javascript項目在導入時找不到模塊
npm install
的package.json中的package.json安裝的所有軟件包:
"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"
},
如此地:https://github.com/handsontable/handsontable/issues/3407我加Handsontable的四個依賴關係的模塊裝載機節webpack配置文件。
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>
當我編譯和運行我的VueJS項目,我得到一個控制檯錯誤:
Error: Cannot find module 'numbro'
我可以看到在node_modules文件夾中帶有numbro.js的numbro文件夾。任何想法可能會出錯?
檢查Chrome瀏覽器開發工具的網絡標籤在頁面加載。你看到404嗎?如果是這樣,這個問題很可能是服務於這個文件。否則,問題在於您在用戶界面中的引用可能不正確地引用。 –
@JohnVandivier這不是一個404錯誤,與我認爲的webpack構建設置有關。 –