如何在前端和后端之间共享TypeScript/JavaScript？

我有一个Node.js/w Angular.js项目的文件夹结构，其中包含一些类似的文件（来自项目根目录）：

我使用TypeScript编译器和许多其他

gulp

插件将其编译到

build

文件夹中，就像这样（注意

frontend

文件如何放置到

public

）：

在源文件夹中，我使用ES6/TypeScript

import

语句导入文件

示例：backend-file1.ts

import './backend-file2';

形势

我已经编写了一些自定义实用程序函数，后端和前端都应该使用这些函数。我不想在两个文件夹中重复相同的功能，因为这很容易出错，而且是双重工作

我曾考虑在

前端

和

后端

文件夹中的项目根目录下创建一个

共享

文件夹，但我无法在浏览器中导入比

index.html

文件更高的文件，该文件位于

前端

文件夹中

问题

---

我如何才能一次性编写一个TypeScript文件，并能够在

前端

和

后端

文件夹中导入该文件？

我只需要这样构造代码：

- src/
   - server/
   - client/
   - shared/

您可以将所有共享库放入

shared

目录，然后从服务器或客户端源文件导入/要求它们：

import '../shared/library'

---

为了扩展已给出的

outFile

案例答案，我将展示我在无法或不想使用webpack/browserify/outFile选项时处理类共享的方法

结构看起来很相似

-client
    index.html
    app.ts
-server
    service.ts
-common
    helper.ts
-dist
    -client
        -index.html
        -lib
            -client
                app.js
            -common
                helper.js
    -server
        service.js
    -common
        helper.js

其思想是如何使用构建结果构建dist文件夹。我使用gulp任务来实现这一点，通过上面的结构，我可以重用公共库中的服务器端和客户端组件

注意。要在客户端工作，请不要忘记在index.html中为systemjs设置基本url：

    System.config({
        baseURL: './lib'
    });

    System.defaultJSExtensions = true;

---

希望这能有所帮助。

我想分享我所做的，这样其他人也能有同样的选择。我觉得其他更干净的选项需要做更多的工作，因为这是一个个人项目，我用一种更简单但更粗糙的方式来设置它

基本上，我想使用符号链接，这样我就可以从任意位置编辑它，而不会出现问题，也不会对当前项目结构进行太多更改。我也很幸运，我不需要为此支持Windows

我已经在

fe

文件夹中有一个React应用程序，在

be

中有一个后端服务器，它们都使用TypeScript。以下是我的文件夹设置结果：

be/
  src/
    shared -> ../../fe/src/shared
fe/
  src/
    shared/

我会注意到React不支持符号链接（IIRC，因为webpack不支持符号链接），所以“真实”文件夹应该在前端

我还希望它在没有手动设置的情况下工作，因此我在

package.json

中制作了一个额外的脚本，以确保符号链接已经设置好。如果符号链接已经存在，它也会创建一个损坏的符号链接，但同样，这是一个个人项目，我同意。（如果有人比我更了解

ln

的话，很高兴更新它。）在后端的

package.json

：

"prebuild": "ln -f -s ../../fe/src/shared src/shared",
"build": "tsc",

---

谢谢你的回答@lxe。但是，问题仍然存在，因为从

客户机

中的

index.html

文件中，我将无法将文件导入到“超出根目录”，即

客户机

文件夹。我将无法从

shared

访问脚本。我想我可以考虑编译<代码>共享< /代码>文件夹到构建中的前端和后端文件夹中。你觉得怎么样？@Nicky假设你正在通过

--out bundle.js

将客户端脚本编译成一个文件，这使得源导入的位置无关紧要。我明白了，我也这么做了，但只是在生产环境中。对于开发，编译后的每个文件都是一个：构建文件夹中的一个。对这种情况有什么建议吗？

be/
  src/
    shared -> ../../fe/src/shared
fe/
  src/
    shared/

"prebuild": "ln -f -s ../../fe/src/shared src/shared",
"build": "tsc",