3

I make project using nextjs 13.4.7 and already install swr in 3 PC but I got the same error: Attempted import error: 'swr' does not contain a default export (imported as 'useSWR'). error TypeError: (0 , swr__WEBPACK_IMPORTED_MODULE_2__.default) is not a function

my swr version is "swr": "^2.2.0"

I use swr like this:

import useSWR from 'swr';

function Todos() {

  // Define the fetcher function to fetch data from the API
  const fetcher = (url) => fetch(url).then((res) => res.json());

  // Use SWR to fetch data from the API
  const { data, error } = useSWR('https://jsonplaceholder.typicode.com/todos/', fetcher);

  if (error) return <div>Failed to load todos</div>;
  if (!data) return <div>Loading todos...</div>;

  return (
    <div>
      <h1>Todos</h1>
      {data.map((todo) => (
        <div key={todo.id}>
          <h3>{todo.title}</h3>
          <p>{todo.completed ? 'Completed' : 'Not completed'}</p>
        </div>
      ))}
    </div>
  );
}

export default Todos;

I hope someone can help me to fix it or report this as a bug from swr

Kusumoon
  • 31
  • 3

2 Answers2

0

I think you forget to type "use client" at the top of code

  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jun 29 '23 at 16:54
0

Try using 'use client' at the top of the page. I am also getting a similar error when trying to use the hook.

(0, swr__WEBPACK_IMPORTED_MODULE_4__.default) is not a function

I found that I forget to use 'use client'. I put 'use client' at the top then the error was resolved.

skmishra
  • 1
  • 3