SharePoint Framework中的反射元数据突然中断

Question

I wrote an NPM module for use in my SharePoint Framework webpart that uses reflect-metadata

import "reflect-metadata";

export function someDecorator(name: string): ClassDecorator {
    return target => {
        Reflect.defineMetadata("MyDecorator", name, target);
    }
}

This was using fine for a few months until yesterday my spfx app suddenly started failing with:

NonErrorEmittedError: (Emitted value instead of an instance of Error) Cannot find source file 'Reflect.ts': Error: Can't resolve './Reflect.ts' in '/mnt/tmp/my-webpart/node_modules/reflect-metadata'
    at emitWarning (/mnt/tmp/my-webpart/node_modules/webpack/lib/NormalModule.js:117:16)
    at /mnt/tmp/my-webpart/node_modules/source-map-loader/index.js:64:7
    at onError (/mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/Resolver.js:65:10)
    at loggingCallbackWrapper (/mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
    at runAfter (/mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/Resolver.js:158:4)
    at innerCallback (/mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/Resolver.js:146:3)
    at loggingCallbackWrapper (/mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
    at next (/mnt/tmp/my-webpart/node_modules/tapable/lib/Tapable.js:252:11)
    at /mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:40:4
    at loggingCallbackWrapper (/mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
    at runAfter (/mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/Resolver.js:158:4)
    at innerCallback (/mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/Resolver.js:146:3)
    at loggingCallbackWrapper (/mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)
    at next (/mnt/tmp/my-webpart/node_modules/tapable/lib/Tapable.js:252:11)
    at innerCallback (/mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/Resolver.js:144:11)
    at loggingCallbackWrapper (/mnt/tmp/my-webpart/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19)

That's from building the exact same code that was just working fine two days ago.

So what could cause this? Why is it suddenly looking for a non-existent Reflect.ts file? And, most importantly, how can I get it working again?

Answer 1

If you manually add Reflect.ts to /node_modules/reflect-metadata your build should succeed.

See issue#95 and pr#89

I opted to copy Reflect.ts into my source code and import this local file instead of "reflect-metadata" .

Note with this solution:

1. tslint warnings occurred so I added /* tslint:disable */ to the top of the file.
2. ts error is in file "Type 'symbol' cannot be used as an index type." due to the TS version spfx uses vs the version reflect-metadata uses. I replaced map[key] with map[key as string | number] map[key as string | number] to get rid of error.

Alternatively, you could fork reflect-metadata and release an updated npm module that includes Reflect.ts.