Azure-sdk-for-js: Angular is consuming dist-esm instead of dist

[johnbigley]

• Azure Storage Blob client library for JavaScript
• 12.0.2
• Windows 10
• Chrome and Firefox

When I navigate to the Angular App I see the following in the Chrome console:

utils.node.js:159 Uncaught TypeError: util__WEBPACK_IMPORTED_MODULE_2__.promisify is not a function
at Module../node_modules/@azure/storage-blob/dist-esm/src/utils/utils.node.js (utils.node.js:159)
at __webpack_require__ (bootstrap:78)
at Module../node_modules/@azure/storage-blob/dist-esm/src/Clients.js (Clients.js:1)
at __webpack_require__ (bootstrap:78)
at Module../node_modules/@azure/storage-blob/dist-esm/src/BlobServiceClient.js (BlobServiceClient.js:1)
at __webpack_require__ (bootstrap:78)
at Module../node_modules/@azure/storage-blob/dist-esm/src/index.browser.js (index.browser.js:1)
at __webpack_require__ (bootstrap:78)
at Module../src/app/common/services/blob-storage-credentials.service.ts (user.model.ts:9)
at __webpack_require__ (bootstrap:78)

It appears that it is loading the files from the node.js code instead of the browser code.
I installed this using npm install @azure/storage-blob. I don't know if this is a bug or a configuration error on my part. Any guidance would be appreciated.

[HarshaNalluru]

Thanks for reporting the issue, @johnbigley .

The issue is on our radar, @jeremymeng is coming up with the fix soon.

[jeremymeng]

Thank you @johnbigley! Could you please provide a minimal project or steps to do to reproduce this issue? We think we know where the problem is but would like to confirm that it is actually the issue you are hitting.

[johnbigley]

Unfortunately, I wrote a proof of concept and it worked fine. I put it in our product and I ran into this error. I am not sure what the difference is. I can't give you our product, but I will try to reproduce it.

[johnbigley]

I am unable to reproduce this outside of the product code. Any progress?

[jeremymeng]

@johnbigley we merged in a fix in PR #7298. Would you be able to give the private build a try? The storage-blob package can be download from https://dev.azure.com/azure-sdk/public/_build/results?buildId=255573&view=artifacts&type=publishedArtifacts

Once you download the file azure-storage-blob-12.0.3.tgz to local disk, you can install it by running npm i path\to\downloaded\azure-storage-blob-12.0.3.tgz

[johnbigley]

Yes, I will give it a try and get back to you.

[johnbigley]

I am getting the following compilation errors:
ERROR in node_modules/@azure/storage-blob/typings/src/Clients.d.ts(704,9): error TS1086: An accessor cannot be declared in an ambient context.
node_modules/@azure/storage-blob/typings/src/Clients.d.ts(708,9): error TS1086: An accessor cannot be declared in an ambient context.
node_modules/@azure/storage-blob/typings/src/Clients.d.ts(2657,9): error TS1086: An accessor cannot be declared in an ambient context.
node_modules/@azure/storage-blob/typings/src/Clients.d.ts(2665,9): error TS1086: An accessor cannot be declared in an ambient context.
node_modules/@azure/storage-blob/typings/src/Clients.d.ts(3136,9): error TS1086: An accessor cannot be declared in an ambient context.
node_modules/@azure/storage-blob/typings/src/SASQueryParameters.d.ts(212,9): error TS1086: An accessor cannot be declared in an ambient context.

[xirzec]

@johnbigley what version of TypeScript are you using?

[johnbigley]

"typescript": "~3.1.1"

[jeremymeng]

@johnbigley We migrated to typescript 3.7 for building our libraries and the generated type definition file are not compatible with typescript 3.1~3.5. @xirzec submit a fix to also include types that are compatible with down-level typescript compilers. Could you please try out the private build from https://dev.azure.com/azure-sdk/public/_build/results?buildId=258631&view=artifacts&type=publishedArtifacts? The file to download is azure-storage-blob-12.1.0.tgz. It's a minor version update because we also added new storage features for next release. Thank you!

[johnbigley]

I am now getting this runtime error:
compiler.js:6440 Uncaught Error: Cannot assign to a reference or variable!
at _AstToIrVisitor.push../node_modules/@angular/compiler/fesm5/compiler.js._AstToIrVisitor.visitPropertyWrite (compiler.js:6440)
at PropertyWrite.push../node_modules/@angular/compiler/fesm5/compiler.js.PropertyWrite.visit (compiler.js:5371)
at convertActionBinding (compiler.js:6118)
at compiler.js:21135
at Array.forEach ()
at ViewBuilder.push../node_modules/@angular/compiler/fesm5/compiler.js.ViewBuilder._createElementHandleEventFn (compiler.js:21131)
at nodes. (compiler.js:20729)
at compiler.js:21093
at Array.map ()
at ViewBuilder.push../node_modules/@angular/compiler/fesm5/compiler.js.ViewBuilder._createNodeExpressions (compiler.js:21092)

[jeremymeng]

@johnbigley this is mysterious. Does this only happen in your production? If not, could you please share a repro project?

[johnbigley]

It happens in production. I will be looking into it today.

[johnbigley]

It was a problem with some new html. It now compiles and runs. When will this version be released?

[jeremymeng]

Glad to know that! We just released the new version today.

[johnbigley]

I appreciate you addressing this problem so quickly. It makes a big impact on the project that I am working on.

[jeremymeng]

Closing as the issue is fixed.