logo标签列表

npm link在使用angular-cli创建的项目中无法工作

javascriptangularwebpackangular-clinpm-link
15

我使用 angular-cli 创建了一个项目。有一个 AppModule 和 AppComponent，我想在其他 Angular 应用程序中使用这个 AppModule 和它的组件（AppComponent）。因此，我创建了一个 index.ts 文件，并导出了 AppModule 和 AppComponent。

export {AppModule} from './src/app/app.module';
export {AppComponent} from './src/app/app.component';

然后使用npm link创建本地链接，并且会使用在package.json中定义的名称创建一个链接。

现在，在我想要使用此导出模块的另一个项目中运行 

npm link project-name
链接已成功完成。我尝试过。
import { AppModule as AModule} from 'my-components';

但是这并没有起作用，因为Webpack编译AppModule文件时未能成功解析引用。在SystemJS中，我们在systemjs.config.js文件中定义了这个映射，但现在没有配置文件。

我该怎么解决呢？

是否有其他方法可以重用本地模块？

你能解决这个问题吗？ - Alejandro Morán
仍然没有 :( 。我会让你知道。 - Sunil Garg
6个回答
11
在Angular 7中，"preserveSymlinks": true 对我起了作用：项目 > 架构师 > 构建 > 选项。
同样适用于Angular 13，这拯救了我的一天。 - Market
9
将以下内容添加到您将npm链接库加载到的主机应用程序的tsconfig.json中。
    "paths": {
      "@angular/*": ["node_modules/@angular/*"]
    }

显然，链接的套餐不能正常使用依赖关系。这将强制该库使用您应用程序的node_modules/@angular/* libs，这就是当您npm install该库时发生的情况。

1
非常感谢！！！！你是我的英雄。 - Veco
1
这让我花了好几个小时才找到 :( - Mark
这是我需要解决链接错误的最后一件事，还有保留符号链接。 - Andrew Knackstedt
更好的问题是，为什么 Angular 团队没有修复这个问题？ - Andrew Knackstedt
3
现在，您可以在angular.json中添加"preserveSymlinks": true ，这样它就能正常运行了。具体来说，您需要在project > architect > build下添加该代码。
1
1
看这里。我认为tgz替代方案要少得多的头痛。至少在大多数情况下，它似乎有更少的问题。https://dev.to/vishesh/creating-new-angular-library-and-publishing-it-in-npm-5f3g - Decoded
1
此答案已经失效。 - Martin
1
我仍然有这个问题，而且我无法通过问题页面提供的解决方案来解决它，你有什么想法吗？ - Alejandro Morán
0

您可以将项目链接放入tsconfig.js文件中，以便在源代码形式下使用任何模块。

请注意，模块别名必须指向一个没有ts或js扩展名的TypeScript文件，而不是指向package.json文件所在的目录。

{
  "compilerOptions": {
    ...
    "paths": {
      "my-third-party-package": [
        // Can be project root relative path or abs path on your hd
        "projects/my-third-party-package/src/index"
      ],
    }
  },
}
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接