了解Angular 2 webpack项目中的源代码符号链接

时间:2016-08-01 14:11:23

标签: javascript typescript angular webpack

我有两个使用webpack作为模块捆绑器和typescript的Angular2项目。

为了在两者之间共享代码,我拆分了一些源代码并创建了一个符号链接到这个'外部'这两个项目的源代码。

执行此操作后的#34;符号链接代码"无法正确解决导入

低于" hello world"项目,以显示我的担忧。

https://github.com/datracka/angular2-symlink-issue

如果您删除给定的src文件夹并创建一个符号链接到另一个src文件夹并使用相同的源代码BUT位于/another/path/src,那么您将获得一个编译器错误:

ERROR in .-shared/src/main.ts
Module build failed: TypeError: Path must be a string. Received undefined
    at assertPath (path.js:7:11)
    at Object.dirname (path.js:1326:5)
    at ensureTypeScriptInstance (/Users/vicensfayos/Projects/angular2-abc/node_modules/ts-loader/index.js:156:103)
    at Object.loader (/Users/vicensfayos/Projects/angular2-abc/node_modules/ts-loader/index.js:403:14)

所以我的问题是:当我"分发"时,我在符号链接中缺少什么。项目文件夹本身的另一个文件夹中的源代码?

我的猜测是配置正确解析webpack https://webpack.github.io/docs/resolving.html中的对象以覆盖node.js加载node_modules算法https://nodejs.org/api/modules.html#modules_loading_from_node_modules_folders但不是运气。

希望有人能指出我的方向。

2 个答案:

答案 0 :(得分:1)

我找到了答案。

我的猜测是正确的。它是关于nodejs如何解决依赖关系的。 https://nodejs.org/api/modules.html#modules_loading_from_node_modules_folders

符号链接的代码试图找到一直向前移动的依赖项,直到找到node_module为止。但没有任何东西。 node_module位于父项目中。

因此,解决方案是从符号链接代码创建另一个符号链接到父项目的node_modules文件夹,以解决依赖关系。

答案 1 :(得分:0)

我有一个类似的设置,但是决定在我的主应用程序中为我的tsconfig.json添加一个路径:

"paths": {
   "*": ["*", "node_modules/*"]
}

共享符号链接文件夹中的源代码所需的所有模块都位于主应用程序的node_modules文件夹中。这告诉编译器在尝试在树的更远位置查找node_modules文件夹之前先查看主应用程序的node_modules文件夹。