Блог

Я столкнулся с проблемой :/ Я хочу, чтобы общая кодовая база «shared» находилась в обоих каталогах. Возможно ли это с самим typescript или мне нужны дополнительные задачи сборки? Есть ли лучшее решение?

Важно: «Общая» папка должна быть сгенерирована в srv и app, иначе наша основная система сломается.

У меня есть следующий src каталог, где client содержит client.ts, server — server.ts, а shared содержит index.ts. Теперь я хочу использовать shared в client.ts и server.ts.

 src
   - client
     - client.ts
     - tsconfig.json
   - server
     - server.ts
     - tsconfig.json
   - shared
     - index.ts
     - tsconfig.json
 

Если я компилирую свой TypeScript, должен быть сгенерирован следующий вывод.

 app
   - client
     - client.js
   - shared
     - index.ts
srv
   - server
     - server.js
   - shared
     - index.ts
 

Вот мои конфигурации для каждого каталога
client/tsconfig.json

 {
    "compileOnSave": true,
    "compilerOptions": {
        "target": "es2018",
        "module": "commonjs",
        "noImplicitAny": true,
        "noUnusedLocals": true,
        "noUnusedParameters": true,
        "removeComments": true,
        "preserveConstEnums": true,
        "outDir": "../../app",
        "sourceMap": true,
        "diagnostics": true,
    },
    "include": [
        "client.ts"
    ],
    "references": [
        { "path": "../shared"}
    ]
}
 

server/ts.config.json

 {
    "compileOnSave": true,
    "compilerOptions": {
        "target": "es2018",
        "module": "commonjs",
        "noImplicitAny": true,
        "noUnusedLocals": true,
        "noUnusedParameters": true,
        "removeComments": true,
        "preserveConstEnums": true,
        "outDir": "../../srv",
        "sourceMap": true,
        "diagnostics": true,
    },
    "include": [
        "server.ts"
    ],
    "references": [
        {
            "path": "../shared"
        }
    ]
}
 

общий /tsconfig.json

 {
    "compilerOptions": {
      "declaration": true, 
      "declarationMap": true,
      "composite": true,     
    },
    "include": [
      "*.*"
    ],
    "references": []
}
 

PS: Если есть лучшее решение для решения этой проблемы. Пожалуйста, дайте мне знать 🙂

С уважением, Себастьян

Вы могли бы попробовать потенциально превратить папку /shared в отдельный пакет npm, а затем использовать npm link / npm install для объединения их вместе в каждом отдельном проекте? Я сделал нечто подобное с React и React Native, используя TypeScript.

Процесс компиляции Typescript не будет перемещать или добавлять файлы для вас. Это просто создание файлов .js для файлов .ts. Только с tsc невозможно создавать пакеты.

Вам следует использовать пакет, подобный webpack Вот ссылка, которая может помочь: https://webpack.js.org/guides/typescript /

При этом я думаю, что то, что вы хотите сделать, неверно. Я предполагаю, что ваш клиент — это одностраничное приложение, а сервер — это сервер узла для обслуживания этих файлов? Если это так, вы запустите свой сервер в среде узла и будете обслуживать client.js .

Вы можете объединить client.js (с помощью webpack или других инструментов командной строки) и обслуживать его непосредственно из server.js . Server.js не понадобится shared.js или client.js находиться в том же каталоге, если вы только не скопируете каталог сервера куда-нибудь.

РЕДАКТИРОВАТЬ: PS: существуют подходы monorepo для таких случаев использования в крупномасштабных проектах. Я бы посоветовал взглянуть на «рабочие пространства yarn» и «lerna»