storybookを起動しようとしたら、Unexpected end of JSON input while parsing near ” のエラーが発生した

storybookを起動しようとしたら、Unexpected end of JSON input while parsing near ” のエラーが発生した

storybookを起動しようとしたら、パースエラーが発生してしまい、調査、解決までの記録です。

エラーメッセージ

storybookを起動しようとしたら、以下のエラーが発生しました。

npm ERR! Failed at the [email protected] storybook script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2020-10-18T11_23_08_161Z-debug.log
info @storybook/vue v5.2.6
info
info => Loading static files from: /var/www/sandbox/app/static .
info => Loading presets
info => Loading presets
info => Loading custom addons config.
info => Loading custom Webpack config (full-control mode).
<s> [webpack.Progress] 0% compiling
<s> [webpack.Progress] 10% building 0/0 modules 0 active
<s> [webpack.Progress] 10% building 0/1 modules 1 active multi /var/www/sandbox/app/node_modules/@storybook/core/dist/server/common/polyfills.js /var/www/sandbox/app/node_modules/@storybook/core/dist/server/preview/globals.js /var/www/sandbox/app/.storybook/config.js /var/www/sandbox/app/node_modules/webpack-hot-middleware/client.js?reload=true&quiet=true
<s> [webpack.Progress] 10% building 1/1 modules 0 active
WARN force closed preview build
ERR! SyntaxError: Cannot parse records: Unexpected end of JSON input while parsing near ''
ERR!     at JSON.parse (<anonymous>)
ERR!     at parseJson (/var/www/sandbox/app/node_modules/json-parse-better-errors/index.js:7:17)
ERR!     at Array.inputFileSystem.readFile (/var/www/sandbox/app/node_modules/webpack/lib/Compiler.js:540:21)
ERR!     at Storage.finished (/var/www/sandbox/app/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)
ERR!     at provider (/var/www/sandbox/app/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9)
ERR!     at /var/www/sandbox/app/node_modules/graceful-fs/graceful-fs.js:115:16
ERR!     at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:54:3)
ERR!  { SyntaxError: Cannot parse records: Unexpected end of JSON input while parsing near ''
ERR!     at JSON.parse (<anonymous>)
ERR!     at parseJson (/var/www/sandbox/app/node_modules/json-parse-better-errors/index.js:7:17)
ERR!     at Array.inputFileSystem.readFile (/var/www/sandbox/app/node_modules/webpack/lib/Compiler.js:540:21)
ERR!     at Storage.finished (/var/www/sandbox/app/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)
ERR!     at provider (/var/www/sandbox/app/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9)
ERR!     at /var/www/sandbox/app/node_modules/graceful-fs/graceful-fs.js:115:16
ERR!     at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:54:3)
ERR!   stack:
ERR!    "SyntaxError: Cannot parse records: Unexpected end of JSON input while parsing near ''\n    at JSON.parse (<anonymous>)\n    at parseJson (/var/www/sandbox/app/node_modules/json-parse-better-errors/index.js:7:17)\n    at Array.inputFileSystem.readFile (/var/www/sandbox/app/node_modules/webpack/lib/Compiler.js:540:21)\n    at Storage.finished (/var/www/sandbox/app/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)\n    at provider (/var/www/sandbox/app/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9)\n    at /var/www/sandbox/app/node_modules/graceful-fs/graceful-fs.js:115:16\n    at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:54:3)" }
WARN FATAL broken build!, will close the process,
WARN Fix the error below and restart storybook.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] storybook: `cross-env API_STUB_FORCE=1 start-storybook -p 3399 -s ./static -c .storybook`
npm ERR! Exit status 1

解決方法

キャッシュファイルが壊れていることが原因のようで、
以下のコマンドを実行し、壊れたキャッシュファイルを削除したら、解消しました。

npm cache clean –force

参考リンク

npm ERR! Unexpected end of JSON input while parsing near ‘…nd-index-1.0.2.tgz” · Issue #990 · vuejs-templates/webpack · GitHub
https://github.com/vuejs-templates/webpack/issues/990

npmでパッケージインストール時にUnexpected end of JSON input while parsing near というエラーが発生する – Netplanetes V2
https://www.pine4.net/Memo2/Article/Archive/Unexpected-end-of-JSON-input-while-parsing-near-when-installaing-package-with-npm

Web技術カテゴリの最新記事