0

I'm trying to provide my data via ContextProvider to my own reactComponent. I've create Context.jsx (I wanted to have external context file). But when I try to connect my Context.jsx with _app.jsx I have an arror:

Could not find a declaration file for module './Context.jsx'. 'Context.jsx' implicitly has an 'any' type.ts(7016)

enter image description here

And here below the code of my Context.jsx:

import React, { createContext, useState, useEffect, useContext } from "react";

const Context = createContext();

const Provider = ({ children }) => {
    // the value that will be given to the context
    const [code, setCode] = useState(null);

    useEffect(() => {
        const fetchBlogs = () => {
            fetch(`https://node-test-mongo.herokuapp.com/api/blog`)

                .then((response) => {
                    return response.json();
                })
                .then((data) => {
                    setCode(data.blogs)
                })
                .catch((error) => console.log("An error occured"));
        };

        fetchBlogs();
    }, []);

    // the Provider gives access to the context to its children
    return <Context.Provider value={code}>{children}</Context.Provider>;
};

export const useCoder = () => useContext(Context);

export default Provider;

What the issue could be here?

Thank you in advance for help:)

  • 1
    Why are you mixing `.jsx` and `.tsx`? – Sinan Yaman Aug 10 '22 at 11:18
  • I'm a newbie in Next.js and TS and I know how to do it for just React, but not for Next.js and TypeScript. I don't know how to do it in Next.js and TS, but I'll be appreciate for some help:) – user17880509 Aug 10 '22 at 11:23
  • 1
    TypeScript errors aside, you should only have page components under the `pages` folder. Move anything else (like a context provider) outside that folder. – juliomalves Aug 13 '22 at 00:01
  • @juliomalves Could you please send some article or something about it? Will be really appreciate. – user17880509 Aug 13 '22 at 09:45
  • 1
    Check out [Can't build React/Next project - found page without a React Component as default export (context api file)](https://stackoverflow.com/a/65598867/1870780), it contains links to the relevant documentation. – juliomalves Aug 13 '22 at 09:47

0 Answers0