Next.js: Link import code broken since 9.5.0 (Type error: Cannot use namespace 'Link' as a type.)

Created on 23 Aug 2020  路  4Comments  路  Source: vercel/next.js

Bug report

Describe the bug

Since 9.5.0 our app won't compile as the module code contains the Link type followed straight by a Namespace and exports the Namespace instead of the type.
image

Module code:
image

To Reproduce

https://github.com/amido/stacks-webapp-template/blob/master/packages/scaffolding-cli/templates/src/ssr/components/Link/index.tsx

Using code like the above compile the application with node_modules/.bin/tsc --project tsconfig.server.json and then node_modules/.bin/next build.

Expected behavior

Compiles correctly.

System information

  • OS: Windows, Cygwin or Ubuntu
  • Browser N/A
  • Version of Next.js: >9.5.0
  • Version of Node.js: v12.13.0 or 12.18.3
story

All 4 comments

Hi @ElvenSpellmaker - Could you update to latest canary 馃檹 , the types should be:

/// <reference types="node" />
import React from 'react';
import { UrlObject } from 'url';
declare type Url = string | UrlObject;
export declare type LinkProps = {
    href: Url;
    as?: Url;
    replace?: boolean;
    scroll?: boolean;
    shallow?: boolean;
    passHref?: boolean;
    prefetch?: boolean;
};
declare function Link(props: React.PropsWithChildren<LinkProps>): React.DetailedReactHTMLElement<{
    onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
    onClick: (event: React.MouseEvent<Element, MouseEvent>) => void;
    href?: string | undefined;
    ref?: any;
}, HTMLElement>;
export default Link;

In any case, If you want to use Link's types, you should do the following instead:

import Link, { LinkProps } from 'next/link'

export const PrefixedLink: React.FC<LinkProps> = ({

Hey @lfades, I've just tried the latest canary and get this now:
image

Yeah sorry I didn't write the code that's there and TypeScript isn't really a language I know very well, it's possible I'd need to defer this to someone who uses TypeScript more often than me. 馃槙

EDIT: Are Link["props"] and LinkProps basically the same thing then?

@ElvenSpellmaker No, Link["props"] isn't valid, Link is a value, not a type. Meanwhile LinkProps is a type designed for this case.

Closing as this is the intended behavior as explained by @lfades (and OP ack'd).

Was this page helpful?
0 / 5 - 0 ratings