search

astroturfcss / astroturf

Better Styling through Compiling: CSS-in-JS for those that want it all.
https://astroturfcss.github.io/astroturf/
MIT License
2.28k stars 60 forks source link

Some errors with latest webpack #678

Open olegshilov opened 3 years ago

olegshilov commented 3 years ago

Hello. I'm trying to use the latest beta astroturf release but faced some errors. I use the latest webpack and yarn 2 with pnp and workspaces endbled.

Trying to use a simple styled button component from readme.md. https://github.com/olegshilov/yarn-2-typescript-webpack-example/blob/main/packages/workspace-b/src/components/StyledComponents.tsx#L3

I have a minimal repository to reproduce this behavior https://github.com/olegshilov/yarn-2-typescript-webpack-example Can someone please tell me what I'm doing wrong?

ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/ComponentUsesBP.tsx
../workspace-b/src/components/ComponentUsesBP.tsx
[tsl] ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/ComponentUsesBP.tsx(14,6)
      TS2786: 'SimpleContainer' cannot be used as a JSX component.
  Its return type 'StyledComponent<"div", {}, never>' is not a valid JSX element.
    Type 'StyledComponent<"div", {}, never>' is missing the following properties from type 'Element': type, props, key
 @ ../workspace-b/src/index.ts 14:13-52
 @ ./src/components/Root.tsx 9:22-44
 @ ./src/index.tsx 8:15-43

ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/ComponentUsesBP.tsx
../workspace-b/src/components/ComponentUsesBP.tsx
[tsl] ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/ComponentUsesBP.tsx(21,8)
      TS2786: 'AstroturfButton' cannot be used as a JSX component.
  Its return type 'StyledComponent<"button", {}, never>' is not a valid JSX element.
    Type 'StyledComponent<"button", {}, never>' is missing the following properties from type 'Element': type, props, key
 @ ../workspace-b/src/index.ts 14:13-52
 @ ./src/components/Root.tsx 9:22-44
 @ ./src/index.tsx 8:15-43

ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/StyledComponents.tsx
../workspace-b/src/components/StyledComponents.tsx
[tsl] ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/StyledComponents.tsx(6,68)
      TS2554: Expected 1-2 arguments, but got 3.
 @ ../workspace-b/src/components/ComponentUsesBP.tsx 10:27-56
 @ ../workspace-b/src/index.ts 14:13-52
 @ ./src/components/Root.tsx 9:22-44
 @ ./src/index.tsx 8:15-43

ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/StyledComponents.tsx
../workspace-b/src/components/StyledComponents.tsx
[tsl] ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/StyledComponents.tsx(8,11)
      TS2693: '_AstroturfButton' only refers to a type, but is being used as a value here.
 @ ../workspace-b/src/components/ComponentUsesBP.tsx 10:27-56
 @ ../workspace-b/src/index.ts 14:13-52
 @ ./src/components/Root.tsx 9:22-44
 @ ./src/index.tsx 8:15-43

ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/StyledComponents.tsx
../workspace-b/src/components/StyledComponents.tsx
[tsl] ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/StyledComponents.tsx(11,65)
      TS2554: Expected 1-2 arguments, but got 3.
 @ ../workspace-b/src/components/ComponentUsesBP.tsx 10:27-56
 @ ../workspace-b/src/index.ts 14:13-52
 @ ./src/components/Root.tsx 9:22-44
 @ ./src/index.tsx 8:15-43

ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/StyledComponents.tsx
../workspace-b/src/components/StyledComponents.tsx
[tsl] ERROR in /Users/olegshilov/Documents/yarn-workspaces-pnp-typescript-webpack-react/packages/workspace-b/src/components/StyledComponents.tsx(13,11)
      TS2693: '_SimpleContainer' only refers to a type, but is being used as a value here.
 @ ../workspace-b/src/components/ComponentUsesBP.tsx 10:27-56
 @ ../workspace-b/src/index.ts 14:13-52
 @ ./src/components/Root.tsx 9:22-44
 @ ./src/index.tsx 8:15-43

webpack 5.21.2 compiled with 6 errors in 722 ms