纱线工作区没有建立本地依赖

Posted

技术标签:

【中文标题】纱线工作区没有建立本地依赖【英文标题】:Yarn Workspaces Not Building Local Dependency 【发布时间】:2021-09-06 06:31:33 【问题描述】:

我删除了我的旧问题,以提供更多信息。我在带有 Angular 应用程序和库的 monorepo 上使用 Yarn 工作区(v1.22)。我已将该库声明为应用程序的依赖项。

root
   |
   ---projects
         |
         ---lib (components)
         |
         ---app

每个项目都有其关联的构建脚本。如果我在根目录或yarn workspace app install 的新结帐上运行yarn,它会安装所有内容并链接到lib 的项目文件夹,但它不会执行构建,这是必要的,因为我的tsconfig 路径包括输出构建dist/lib。安装的最后一步是“Building Fresh Packages”,但由于某种原因它不会触发 lib 的构建。

tsconfig.json(基础)


  "compileOnSave": false,
  "compilerOptions": 
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "module": "es2020",
    "lib": [
      "es2018",
      "dom"
    ],
    "paths": 
      "@fabric/components/*": [
        "./dist/components/*"
      ]
    
  ,
  "angularCompilerOptions": 
    "strictInjectionParameters": true,
    "strictInputAccessModifiers": true,
    "strictTemplates": true
  

根包


  "name": "fabric",
  "private": true,
  "license": "UNLICENSED",
  "workspaces": [
    "projects/*"
  ],
  "engines": 
    "node": ">=12.0.0 < 16.0.0",
    "yarn": ">= 1.0.0",
    "npm": "Please use Yarn instead of NPM to install dependencies. See: https://yarnpkg.com/lang/en/docs/install/"
  ,
  "scripts": 
    "ng": "ng",
    "start": "ng serve",
    "components": "yarn workspace @fabric/components",
    "guide-app": "yarn workspace @fabric/guide-app",
    "test": "yarn guide-app test && yarn components test",
    "postinstall": "ngcc"
  ,
  "dependencies": 
    "@angular/animations": "12.0.2",
    "@angular/cdk": "12.0.2",
    "@angular/common": "12.0.2",
    "@angular/compiler": "12.0.2",
    "@angular/core": "12.0.2",
    "@angular/flex-layout": "12.0.0-beta.34",
    "@angular/forms": "12.0.2",
    "@angular/localize": "12.0.2",
    "@angular/material": "12.0.2",
    "@angular/platform-browser": "12.0.2",
    "@angular/platform-browser-dynamic": "12.0.2",
    "@angular/router": "12.0.2",
    "rxjs": "6.6.7",
    "tslib": "2.2.0",
    "zone.js": "0.11.4"
  ,
  "devDependencies": 
    "@angular-devkit/build-angular": "12.0.2",
    "@angular-devkit/core": "12.0.2",
    "@angular-devkit/schematics": "12.0.2",
    "@angular/cli": "12.0.2",
    "@angular/compiler-cli": "12.0.2",
    "@angular/language-service": "12.0.2",
    "@schematics/angular": "12.0.2",
    "@types/jest": "26.0.23",
    "@types/node": "14.14.37",
    "codelyzer": "6.0.2",
    "jest": "26.6.3",
    "jest-junit": "12.1.0",
    "jest-preset-angular": "8.4.0",
    "jest-transform-stub": "2.0.0",
    "ng-packagr": "12.0.2",
    "protractor": "7.0.0",
    "tslint": "6.1.3",
    "typescript": "4.2.4"
  


lib 包


  "name": "@fabric/components",
  "version": "5.0.2",
  "license": "UNLICENSED",
  "engines": 
    "node": ">=12.0.0 < 16.0.0",
    "yarn": ">= 1.0.0",
    "npm": "Please use Yarn instead of NPM to install dependencies. See: https://yarnpkg.com/lang/en/docs/install/"
  ,
  "scripts": 
    "build": "ng build components --configuration production",
    "watch": "ng build components --watch",
    "test": "jest --config ./jest.config.js"
  ,
  "dependencies": 
    "@fontsource/roboto": "^4.4.0",
    "tslib": "^2.2.0"
  ,
  "peerDependencies": 
    "@angular/cdk": "^12.0.0",
    "@angular/common": "^12.0.0",
    "@angular/core": "^12.0.0",
    "@angular/flex-layout": "^12.0.0-beta.34",
    "@angular/localize": "^12.0.0",
    "@angular/material": "^12.0.0"
  


应用程序包


  "name": "@fabric/guide-app",
  "version": "5.0.1",
  "license": "UNLICENSED",
  "engines": 
    "node": ">=12.0.0 < 16.0.0",
    "yarn": ">= 1.0.0",
    "npm": "Please use Yarn instead of NPM to install dependencies. See: https://yarnpkg.com/lang/en/docs/install/"
  ,
  "scripts": 
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build --configuration production",
    "watch": "ng build --watch --configuration development",
    "test": "jest --config ./jest.config.js",
    "lint": "ng lint",
    "e2e": "ng e2e",
  ,
  "private": true,
  "dependencies": 
    "@fabric/components": "^5.0.0",
    "@ngx-translate/core": "~13.0.0",
    "@ngx-translate/http-loader": "~6.0.0",
    "ngx-highlightjs": "~4.1.3"
  


所以我想,首先,我的假设是否正确,Yarn 应该构建依赖包? 如果是这样,我的配置中有什么不正确的吗?如果这不是 yarn 产品的一部分,您对可以添加什么来支持它有什么建议吗?

【问题讨论】:

【参考方案1】:

您的文件夹结构 workspacesdependencies 已正确设置。要让 yarn 调用您的构建脚本,您必须将其添加到您的 lib 包的 postinstall 和/或 prepare 脚本中:


  "scripts": 
    "build": "...",
    "postinstall": "yarn build"
  

安装app 包时,它应该运行其所有依赖项的安装后脚本。但是请注意,在不同的上下文中使用 lib 时可能不需要这种副作用,例如作为一个独立的包。

请注意,在对lib 进行更改时,您必须更改其版本,并且该版本必须在app 在其dependencies 中指定的范围内。只有这样,yarn 才会在重新安装app 时重新执行其安装后脚本。


除此之外,我注意到您使用 tsconfig 的 compilerOptions.paths 来引用 lib。还有另一种方法可以使用typescript references。一个好的起点是this article。

【讨论】:

以上是关于纱线工作区没有建立本地依赖的主要内容,如果未能解决你的问题,请参考以下文章

我可以从本地纱线工作区依赖包中导入“main”:“index.js”文件之外的子模块吗?

如何保持纱线工作区依赖关系同步

解决纱线工作区中的 TypeScript 依赖项

纱线工作区——包别名

Firebase 推送通知在纱线手表中工作,但在纱线构建中不工作

如何安装没有符号链接的纱线工作区包?