如何将TS路径Map与Firebase Cloud Functions一起使用?我尝试了但没有成功:
"baseUrl": ".", "paths": { "@custom-path/*": ["src/utils/*"], "@other-path/*": ["../other/path/*"] }
n1bvdmb61#
最后,我可以用module-alias NPM包来实现这一点。1.将其安装为非dev依赖项:yarn add module-alias @types/module-alias1.创建一个文件fixTsPaths.ts或类似的文件,内容如下:
module-alias
yarn add module-alias @types/module-alias
fixTsPaths.ts
import * as ModuleAlias from 'module-alias'; ModuleAlias.addAliases({ 'common': __dirname + '/../../../common', });
以下是关于路径/../../../common的技巧:在我的例子中,这个文件夹在functions之外,Typescript在构建过程中复制了文件夹结构,所以这可能是https://github.com/dividab/tsconfig-paths无法开箱即用的原因。所以在任何情况下,都需要检查这个路径并找到合适的'..' count:)1.最后,将此文件导入index.ts的最顶部:
/../../../common
functions
index.ts
import './fixTsPaths';
希望这有帮助!
e4eetjau2#
它是2023,最简洁的方法是使用tsc-alias。在tsconfig.json上,添加baseUrl,并在compilerOptions下添加paths。类似于:
2023
tsconfig.json
baseUrl
compilerOptions
paths
{ "compilerOptions": { ... "baseUrl": "./src", "paths": { "@constants/*": ["api/constants/*"], "@interfaces/*": ["api/interfaces/*"], "@middlewares/*": ["api/middlewares/*"], "@modules/*": ["api/modules/*"], "@services/*": ["api/services/*"] }, ... }
然后,在package.json下更改serve和build脚本。如下所示:
package.json
serve
build
... "scripts": { "build": "tsc && tsc-alias", "build:watch": "concurrently \"tsc -w\" \"tsc-alias -w\"", "serve": "concurrently --kill-others \"firebase emulators:start --only functions\" \"npm run build:watch\"", ... }, ...
这里️我使用的是concurrently,但你可以随意使用任何你喜欢的。就是这样。现在你可以使用你定义的路径导入东西,比如:
concurrently
import { messages } from '@constants/responses' import CandidatesService from '@modules/candidates/candidates.service' import { IModule } from '@interfaces/module.interface'
等等。
z18hc3ub3#
问题出在tslint.json上的规则no-implicit-dependencies: true。你可以传递额外的参数来将你的自定义路径加入白名单:
tslint.json
no-implicit-dependencies: true
"no-implicit-dependencies": [true, ["@custom-path", "@other-path"]],
sc4hvdpw4#
对于任何人谁仍然与这个问题的斗争,但下面的代码在入口点文件的顶部(main.ts).不要忘记调整tsconfig.json文件路径,如果它不是在默认位置
const tsConfig = require('../tsconfig.json'); const tsConfigPaths = require('tsconfig-paths'); tsConfigPaths.register({ baseUrl: __dirname, paths: tsConfig.compilerOptions.paths, });
unguejic5#
我可以使用@zerollup/ts-transform-paths NPM包来实现这一点。1.安装@zerollup/ts-transform-paths作为dev依赖项:yarn add -D @zerollup/ts-transform-paths1.按照webpack + ts加载程序的配置进行设置。
yarn add -D @zerollup/ts-transform-paths
const tsTransformPaths = require('@zerollup/ts-transform-paths'); module.exports = { ... // other config module: { rules: [ { test: /\.(ts|tsx)$/, loader: 'ts-loader', options: { getCustomTransformers: (program) => { const transformer = tsTransformPaths(program); return { before: [transformer.before], // for updating paths in generated code afterDeclarations: [transformer.afterDeclarations] // for updating paths in declaration files }; } } } ] } };
查看更多详情:https://github.com/zerkalica/zerollup/tree/5aee60287647350215c81d0b2da5a30717d9dccb/packages/ts-transform-paths
5条答案
按热度按时间n1bvdmb61#
最后,我可以用
module-alias
NPM包来实现这一点。1.将其安装为非dev依赖项:
yarn add module-alias @types/module-alias
1.创建一个文件
fixTsPaths.ts
或类似的文件,内容如下:以下是关于路径
/../../../common
的技巧:在我的例子中,这个文件夹在functions
之外,Typescript在构建过程中复制了文件夹结构,所以这可能是https://github.com/dividab/tsconfig-paths无法开箱即用的原因。所以在任何情况下,都需要检查这个路径并找到合适的'..' count:)1.最后,将此文件导入
index.ts
的最顶部:希望这有帮助!
e4eetjau2#
它是
2023
,最简洁的方法是使用tsc-alias。在
tsconfig.json
上,添加baseUrl
,并在compilerOptions
下添加paths
。类似于:然后,在
package.json
下更改serve
和build
脚本。如下所示:这里️我使用的是
concurrently
,但你可以随意使用任何你喜欢的。就是这样。现在你可以使用你定义的路径导入东西,比如:
等等。
z18hc3ub3#
问题出在
tslint.json
上的规则no-implicit-dependencies: true
。你可以传递额外的参数来将你的自定义路径加入白名单:sc4hvdpw4#
对于任何人谁仍然与这个问题的斗争,但下面的代码在入口点文件的顶部(main.ts).不要忘记调整tsconfig.json文件路径,如果它不是在默认位置
unguejic5#
我可以使用@zerollup/ts-transform-paths NPM包来实现这一点。
1.安装@zerollup/ts-transform-paths作为dev依赖项:
yarn add -D @zerollup/ts-transform-paths
1.按照webpack + ts加载程序的配置进行设置。
查看更多详情:https://github.com/zerkalica/zerollup/tree/5aee60287647350215c81d0b2da5a30717d9dccb/packages/ts-transform-paths