エラー
NuxtでStorybookを導入したらこのようなエラーが発生してしまいます。Reactの構文なのはなぜでしょう...
Module build failed (from ./node_modules/babel-loader/lib/index.js): SyntaxError: Unexpected token (20:11) 18 | components: { MyButton }, 19 | render(h) { > 20 | return <my-button onClick={this.action}>With JSX</my-button>; | ^ 21 | }, 22 | methods: { action: linkTo('clicked') }, 23 | });
package.json
{ "name": "frontend", "version": "1.0.0", "description": "Nuxt.js project", "author": "", "private": true, "scripts": { "dev": "nuxt", "dev-3001": "nuxt --hostname=localhost --port=3001", "build": "nuxt build", "start": "nuxt start", "generate": "nuxt generate", "lint": "eslint --ext .js,.vue --ignore-path .gitignore .", "precommit": "npm run lint", "test": "jest --config jest.config.js", "storybook": "start-storybook -p 6006", "build-storybook": "build-storybook" }, "dependencies": { "@nuxtjs/auth": "^4.8.5", "@nuxtjs/axios": "^5.9.5", "axios-cookiejar-support": "^0.5.1", "cookieparser": "^0.1.0", "nuxt": "^2.0.0" }, "devDependencies": { "@babel/core": "^7.9.0", "@nuxtjs/vuetify": "^1.11.0", "@storybook/addon-actions": "^5.3.17", "@storybook/addon-links": "^5.3.17", "@storybook/addons": "^5.3.17", "@storybook/vue": "^5.3.17", "@vue/test-utils": "^1.0.0-beta.32", "babel-core": "^6.26.3", "babel-eslint": "^10.0.1", "babel-jest": "^25.2.3", "babel-loader": "^7.1.5", "babel-preset-env": "^1.7.0", "babel-preset-vue": "^2.0.2", "eslint": "^4.19.1", "eslint-friendly-formatter": "^4.0.1", "eslint-loader": "^2.1.1", "eslint-plugin-vue": "^4.0.0", "jest": "^25.2.3", "node-sass": "^4.13.1", "nuxt-sass-resources-loader": "^2.0.5", "sass-loader": "^8.0.2", "vue-jest": "^3.0.5" } }
Storybookを導入した手順
$ npm install -g @storybook/cli $ getstorybook $ npm run storybook
質問
なぜこのようなエラーがでるのでしょうか?
また、解決策をご教示頂けると助かります
あなたの回答
tips
プレビュー