回答編集履歴
1
typo
test
CHANGED
@@ -1,7 +1,8 @@
|
|
1
1
|
公式のチュートリアルが不親切すぎるんです…。
|
2
2
|
|
3
3
|
### 不具合の理由
|
4
|
-
- 普通のJavaScriptって、`root.render(<h1>Hello, world!</h1>);`みたいに、直接タグかいたらエラー起こりますよね?
|
4
|
+
- 普通のJavaScriptって、`root.render(<h1>Hello, world!</h1>);`みたいに、直接HTMLタグをかいたらエラー起こりますよね?だからいつもは文字列としてタグを書いてますよね。
|
5
|
+
- 例 `'<h1>いつもの</h1>'`
|
5
6
|
- `test.js`はただのJavaScriptファイルなので、通常通りエラーになります。
|
6
7
|
|
7
8
|
### 対策
|
@@ -9,7 +10,7 @@
|
|
9
10
|
- `test.js` → `test.jsx`と、拡張子を変更しましょう。
|
10
11
|
- そうするとブラウザがJSXを理解できずエラーになってしまいます。
|
11
12
|
- ReactのCDNの下に、JSXを→JSに変換してくれるBabelのCDNを読み込みましょう。
|
12
|
-
- そしてscriptタグでJSXファイルを読み込む際は`type=text/babel`にします。
|
13
|
+
- そしてscriptタグでJSXファイルを読み込む際は`type="text/babel"`にします。
|
13
14
|
|
14
15
|
```html
|
15
16
|
<div id="root"></div>
|