質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
Babel

Babelは、JavaScriptの次世代仕様であるECMAScriptのコンパイラ。次世代の標準機能を用いて記述されたコードを、それらの機能に対応していないブラウザでも動作するコードに変換することができます。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Q&A

0回答

1213閲覧

create-react-appで作ったアプリのbabel設定ファイルはプロジェクトフォルダのどこにありますか?

moyong

総合スコア19

Babel

Babelは、JavaScriptの次世代仕様であるECMAScriptのコンパイラ。次世代の標準機能を用いて記述されたコードを、それらの機能に対応していないブラウザでも動作するコードに変換することができます。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

0グッド

0クリップ

投稿2021/03/27 03:37

編集2021/03/28 04:52

前提・実現したいこと

VCcodeの問題タブに出てくる

SyntaxError: Post.test.js: Supoprt for the experimental syntax 'jsx' isn't currently enabled

を解決したいです。
エラー画面に従って
yarn add @babel/preset-react -Dしましたが、その先のBabel Configというのがどこにあるのかわかりません。
Create-react-appはbabelやwebpackの存在を隠蔽するということが調べていて分かったのですが、node_modulesの中でbabelという名前がついたファイルを手当たり次第探ってみてもbabel.config.jsのようなものが見つからず質問させていただいた次第です。

発生している問題・エラーメッセージ

イメージ説明
to the 'presets' section of your Babel configu to ebable transformation
の意味がいまいちよくわかりません...。

該当のソースコード

packageJson

1{ 2 "name": "workout-journal", 3 "version": "0.1.0", 4 "private": true, 5 "dependencies": { 6 "@craco/craco": "^6.1.1", 7 "@material-ui/core": "^4.11.3", 8 "@material-ui/icons": "^4.11.2", 9 "@material-ui/lab": "^4.0.0-alpha.57", 10 "@reduxjs/toolkit": "^1.5.0", 11 "@types/node": "^12.20.4", 12 "@types/react": "^16.14.4", 13 "@types/react-dom": "^16.9.11", 14 "@types/react-redux": "^7.1.16", 15 "axios": "^0.21.1", 16 "firebase": "^8.2.9", 17 "hover.css": "^2.3.2", 18 "mime-types": "^2.1.29", 19 "react": "^17.0.1", 20 "react-calendar-heatmap": "^1.8.1", 21 "react-dom": "^17.0.1", 22 "react-redux": "^7.2.2", 23 "react-scripts": "4.0.3", 24 "react-tooltip": "^4.2.15", 25 "typescript": "^3.8.3" 26 }, 27 "scripts": { 28 "start": "craco start", 29 "build": "craco build", 30 "test": "craco test --env=jsdom --verbose", 31 "eject": "react-scripts eject" 32 }, 33 "eslintConfig": { 34 "extends": "react-app" 35 }, 36 "browserslist": { 37 "production": [ 38 ">0.2%", 39 "not dead", 40 "not op_mini all" 41 ], 42 "development": [ 43 "last 1 chrome version", 44 "last 1 firefox version", 45 "last 1 safari version" 46 ] 47 }, 48 "devDependencies": { 49 "@babel/preset-react": "^7.12.13", 50 "@tailwindcss/postcss7-compat": "^2.0.3", 51 "@testing-library/jest-dom": "^5.11.9", 52 "@testing-library/react": "^11.2.5", 53 "@testing-library/user-event": "^13.0.15", 54 "@types/jest": "^26.0.21", 55 "@types/react-calendar-heatmap": "^1.6.2", 56 "autoprefixer": "^9.8.6", 57 "node-sass": "^5.0.0", 58 "postcss": "^7.0.35", 59 "tailwindcss": "npm:@tailwindcss/postcss7-compat@^2.0.3", 60 "ts-jest": "^26.5.4" 61 } 62} 63

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問