TypeError: данные должны быть строкой или буфером при попытке использовать vue-bulma-tabs

Question

У меня возникла эта странная ошибка с vue и vue-bulma-tabs.

Project is running at http://localhost:8081/ 
webpack output is served from /dist/ 
404s will fallback to /index.html 
crypto.js:74 
    this._handle.update(data, encoding); 
      ^

TypeError: Data must be a string or a buffer 
    at TypeError (native) 
    at Hash.update (crypto.js:74:16) 
    at HarmonyExportImportedSpecifierDependency.updateHash (/Users/esteban/Projects/experiments/example1/node_modules/webpack/lib/dependencies/HarmonyExportImportedSpecifierDependency.js:144:8) 
    at /Users/esteban/Projects/experiments/example1/node_modules/webpack/lib/DependenciesBlock.js:33:5 
    at Array.forEach (native) 
    at NormalModule.DependenciesBlock.updateHash (/Users/esteban/Projects/experiments/example1/node_modules/webpack/lib/DependenciesBlock.js:32:20) 
    at NormalModule.Module.updateHash (/Users/esteban/Projects/experiments/example1/node_modules/webpack/lib/Module.js:162:41) 
    at NormalModule.updateHash (/Users/esteban/Projects/experiments/example1/node_modules/webpack/lib/NormalModule.js:327:30) 
    at modules.forEach.m (/Users/esteban/Projects/experiments/example1/node_modules/webpack/lib/Chunk.js:253:31) 
    at Array.forEach (native) 

Я думаю, что это связано с webpack, но я не понимаю, в чем проблема, и как я могу ее исправить.

воспроизвести его, просто сделать это

vue init webpack-simple example1 
cd example1 
npm i 
npm i -S bulma vue-bulma-tabs 

затем добавить это к main.js файл

import {Tabs, TabPane} from 'vue-bulma-tabs' 

затем запустить

npm run dev 

вуаля! есть ошибка. что мне не хватает?

Answer 1

Я нашел проблему, я не уверен, кто виноват.

vue-bulma-tabs использует импорт без расширений для файлов Vue. но простой шаблон webpack от vue не поддерживает это.

решение настроить Webpack попробовать .vue, а также .js на webpack.config.js под ключ решимостью, добавьте

extensions: ['.js', '.vue']

и сейчас работает.

Answer 2

Таким образом, основной причиной этой проблемы является импорт, который не находит файл, который вы пытаетесь импортировать. См. https://github.com/webpack/webpack/issues/4072#issuecomment-278626604 для обходного пути, чтобы добавить некоторые записи, чтобы помочь вам найти то, что является файлом, который вы не можете импортировать.