質問編集履歴

4

[試したこと] の追加

2022/09/23 16:57

投稿

hirotaka612
hirotaka612

スコア32

test CHANGED
File without changes
test CHANGED
@@ -51,5 +51,24 @@
51
51
  `Type error: Binding element 'Component' implicitly has an 'any' type.` のエラーが発生。
52
52
  Component, pageProps, router それぞれで型指定をしていけば解決する...??
53
53
 
54
+ ```javascript
55
+ import "../styles/globals.scss";
56
+ import { AnimatePresence } from "framer-motion";
57
+
58
+ function MyApp({ Component, pageProps, router }: {Component: any, pageProps: any, router: any} ) {
59
+ return (
60
+ <AnimatePresence exitBeforeEnter onExitComplete={() => window.scrollTo(0, 0)}>
61
+ <Component key={router.asPath} {...pageProps} />
62
+ </AnimatePresence>
63
+ );
64
+ }
65
+
66
+ export default MyApp;
67
+ ```
68
+ 試しに AppProps を使用せず、それぞれ型指定をする方式にしてみると結局
69
+ `4:48 Error: Parsing error: Unexpected token :` が発生するので AppProps の問題ではなく記法の問題のようでした。
70
+
71
+ typescript を入れているのですが jsx として ESLint に見られているとか...??
72
+
54
73
  ### 補足情報(FW/ツールのバージョンなど)
55
74
  yarn run dev は普通に動き、動作は問題ないです。

3

[試したこと] を追加

2022/09/23 16:52

投稿

hirotaka612
hirotaka612

スコア32

test CHANGED
File without changes
test CHANGED
@@ -13,7 +13,7 @@
13
13
 
14
14
  ### 該当のソースコード
15
15
 
16
- ```javascript:
16
+ ```javascript
17
17
  // /pages/_app.tsx
18
18
  import "../styles/globals.scss";
19
19
  import { AnimatePresence } from "framer-motion";
@@ -31,7 +31,25 @@
31
31
  ```
32
32
 
33
33
  ### 試したこと
34
+ AppProps を使わない形にしてみましたが
35
+
36
+ ```javascript
37
+ import "../styles/globals.scss";
38
+ import { AnimatePresence } from "framer-motion";
39
+
40
+ function MyApp({ Component, pageProps, router }) {
41
+ return (
42
+ <AnimatePresence exitBeforeEnter onExitComplete={() => window.scrollTo(0, 0)}>
43
+ <Component key={router.asPath} {...pageProps} />
44
+ </AnimatePresence>
45
+ );
46
+ }
47
+
48
+ export default MyApp;
49
+ ```
50
+
34
- 5行目の `: AppProps` に対して言われていると思ったので、 AppProps を消してみましたが、今度は { Component, pageProps, router } が使えなくなり、エラーメッセージを使って色々調べました何も糸口が掴めませんでした
51
+ `Type error: Binding element 'Component' implicitly has an 'any' type.` エラーが発生
52
+ Component, pageProps, router それぞれで型指定をしていけば解決する...??
35
53
 
36
54
  ### 補足情報(FW/ツールのバージョンなど)
37
55
  yarn run dev は普通に動き、動作は問題ないです。

2

ファイル名を追加

2022/09/23 16:38

投稿

hirotaka612
hirotaka612

スコア32

test CHANGED
File without changes
test CHANGED
@@ -13,7 +13,8 @@
13
13
 
14
14
  ### 該当のソースコード
15
15
 
16
- ```javascript
16
+ ```javascript:
17
+ // /pages/_app.tsx
17
18
  import "../styles/globals.scss";
18
19
  import { AnimatePresence } from "framer-motion";
19
20
  import { AppProps } from "next/app";

1

シンタックスハイライトを効かせるため

2022/09/23 16:34

投稿

hirotaka612
hirotaka612

スコア32

test CHANGED
File without changes
test CHANGED
@@ -13,7 +13,7 @@
13
13
 
14
14
  ### 該当のソースコード
15
15
 
16
- ```React
16
+ ```javascript
17
17
  import "../styles/globals.scss";
18
18
  import { AnimatePresence } from "framer-motion";
19
19
  import { AppProps } from "next/app";