Lerna+Yarn Workspaces单体仓库中React SketchApp依赖问题求助

Let's break down your problem and walk through actionable fixes step by step:

1. Fix Your TypeScript Configuration #

First, that TS2304: Cannot find name 'context' error is likely tied to how your package's TypeScript setup resolves dependencies from the root node_modules. Here's what to adjust:

• In your react-sketchapp-package/tsconfig.json, extend the root config to inherit resolution rules, or explicitly map paths to root dependencies:

  {
    "extends": "../../tsconfig.json",
    "compilerOptions": {
      "moduleResolution": "node",
      "baseUrl": ".",
      // Map root dependencies directly if needed
      "paths": {
        "styled-components": ["../../node_modules/styled-components"],
        "react": ["../../node_modules/react"]
      }
    },
    "include": ["src/**/*"]
  }
  

• Verify that @types/react and other type dependencies required by react-sketchapp are installed at the root level (not just in the package) — missing type definitions are a common cause of "cannot find name" errors.

2. Validate Lerna + Yarn Workspaces Setup #

Manual symlinks are unnecessary with Yarn Workspaces, so let's ensure your tooling is handling dependency linking correctly:

• In your root package.json, confirm the workspaces field is properly configured:

  "workspaces": [
    "packages/*"
  ]
  

• In lerna.json, enable Yarn Workspaces integration to let Yarn manage dependency hoisting:

  {
    "packages": ["packages/*"],
    "npmClient": "yarn",
    "useWorkspaces": true,
    "version": "independent" // Use your preferred versioning strategy
  }
  

• Perform a clean install: Delete the root node_modules folder, plus any node_modules folders inside your packages. Then run yarn install from the root — Yarn will automatically hoist shared dependencies and symlink packages correctly.

3. Fix the Script Execution Environment #

The npm WARN Local package.json exists, but node_modules missing hint suggests your package's script isn't picking up the root node_modules environment. Try these tweaks:

• In your react-sketchapp-package/package.json, update the TypeScript script to use Yarn's resolved tsc (which will pull from the root):

  "scripts": {
    "typescript:once": "yarn tsc --project ./tsconfig.json"
  }
  

• Alternatively, run the script from the root using Lerna, which ensures the correct environment is loaded:

  lerna run typescript:once --scope @react-sketchapp-package
  

4. Double-Check Styled-Components Compatibility #

Since you switched to this setup to fix duplicate styled-components, confirm:

• Styled-components is only listed as a dependency in the root package.json (avoid declaring it in individual packages, or use peerDependencies in packages to declare compatibility).
• The version of styled-components you're using matches react-sketchapp's version requirements (check react-sketchapp's docs for any constraints).

Final Verification Steps #

1. Re-run yarn install from the root to ensure all dependencies are hoisted and linked properly.
2. Test your package's script via Lerna first to rule out environment-related issues.
3. If the context error persists, check if react-sketchapp requires specific TypeScript flags (like jsx: react-jsx) that might be missing in your config.

内容的提问来源于stack exchange，提问作者Filil Lindbladh