大家好，又见面了，我是你们的朋友全栈君。
PHP 当中有许多很有用的魔术变量, 比如__CLASS__, __METHOD__之类. 但是typescript中并没有. 因此我写了一个插件typescript-magic-variable-plugin来使用它们, 源代码已经放到了GitHub上: https://github.com/acrazing/t….
使用方法
- 首先你需要安装这个包:
npm install -D typescript-magic-variable-plugin -
修改一下你的tsconfig:
{ "compilerOptions": { "plugins": [ { "transform": "typescript-magic-variable-plugin" } ] }, "include": [ // ... "./node_modules/typescript/magic-variable-plugin/types/globals.d.ts" ] } -
在代码中使用魔术变量, 比如:
export class Foo { constructor() { console.log(__CLASS__) } } - 用
ttypescript来编译你的项目, 注意这里不能用typescript, 因为没有开放transform接口, 需要全局安装一下ttypescript:npm i -g ttypescript, 然后调用ttsc来编译.
进阶
-
也可以在webpack中使用:
const { createMagicVariableTransformer } = require('typescript-magic-variable-plugin') // ... rules: [ { test: /\.tsx?$/, loader: 'awesome-typescript-loader', options: { // ... other loader's options getCustomTransformers: program => ({ before: [ createMagicVariableTransformer(program, {}) ] }) } } ] -
目前支持的变量:
name type description __NAMESPACE__stringthe full name of the current namespace, use .to join the parents__CLASS__stringthe class name of the declaring class __METHOD__stringthe method name of the declaring method __FUNCTION__stringthe function name of the declaring function __DIR__stringthe current directory of the code __FILE__stringthe current file full name of the code __LINE__numberthe current line number -
可以自动给React的组件添加
displayName属性, 默认开启, 比如:export class Foo extends Component {}会自动给
Foo增加静态属性:Foo.displayName = "Foo" -
配置:
interface Options { addDisplayName: boolean; // 是否给react组件添加displayName属性, 默认开启 rootDir: string; // __DIR__的相对路径, 默认为tscofnig.json中的rootDir或者当前文件夹 }
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/107352.html原文链接：https://javaforall.net
