# Depedent assets are not accessible when running Client.init in angular 12

**URL:** <https://devforum.zoom.us/t/depedent-assets-are-not-accessible-when-running-client-init-in-angular-12/54150>\
**Category:** Web\
**Created:** [July 14, 2021, 4:36pm UTC](https://devforum.zoom.us/t/depedent-assets-are-not-accessible-when-running-client-init-in-angular-12/54150 "2021-07-14T16:36:59Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![dataonedigital](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/dataonedigital/32/17706_2.png) [@dataonedigital](https://devforum.zoom.us/u/dataonedigital)\
**Post date:** [July 14, 2021, 4:36pm UTC](https://devforum.zoom.us/t/depedent-assets-are-not-accessible-when-running-client-init-in-angular-12/54150/1 "2021-07-14T16:36:59Z")

</div>

I need help getting setup with the video sdk version v1.1.0 in Angular 12.1.0. The documentation for step 3 states we have to deploy the sdk assets using webpack before we begin using the client.

In angular i went ahead and installed the angualr builders library to create a custom webpackconfig, ive tried a few things but my most basic version has the webpack config looking exactly like the documentation.

module.exports = {  
plugins: [  
new CopyPlugin({  
patterns: [{  
from: ‘node\_modules/zoom/videosdk/dist/lib’,  
to: ‘dest/zoom-libs’ // The destination folder, which you can rename as you wish  
}  
],  
})  
]  
}

The data is getting copied over to the directory dist\ScreenShare\dest\zoom-libs  
so inside app.component.ts on ngOnInit, i run \_CLIENT.init(‘en-US’, ‘dist\ScreenShare\dest\zoom-libs’);  
I’ve tried a few ways hoping my path was the issue but no matter what path i specify i keep getting the same error.

tries paths such as  
\_CLIENT.init(‘en-US’, ‘[http://localhost:4200/node\_modules/zoom/videosdk/dist/lib/](http://localhost:4200/node_modules/zoom/videosdk/dist/lib/)’);

```
_CLIENT.init('en-US', 'http://localhost:4200/assets/lib/');

```

When i run it i can access the file at //http://localhost:4200/assets/lib/webim.min.js  
from the browser but the error remains.

I’m hoping there is a simpler way to get this working in angular then being force to change the webpack config. If not I could use some help in getting setup with an angular demo of some sort.

The error im getting states “type”:“INVALID\_PARAMETERS”,“reason”:“depedent assets are not accessible”"

 ![zoomerror](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/f/c/fcb2712205c3b75506062fb47c55baca53dfa392.png)

video sdk version v1.1.0 in Angular 12.1.0.

To reproduce  
1.) Create new angular 12.1 app  
2.) Add the video sdk  
3.) Create new custom-webpack.config.js file and dependencies & add  
const { override, addWebpackPlugin, overrideDevServer } = require(‘customize-cra’);  
const path = require(‘path’);  
const CopyPlugin = require(‘copy-webpack-plugin’);  
const WriteFilePlugin = require(‘write-file-webpack-plugin’);

console.log(“HERERERERERE”);  
const addWriteFilePlugin = (config) =\> {  
config.plugins.push(new WriteFilePlugin());  
config.output.futureEmitAssets = false;  
// [Support Webpack 4.29.0 breaking change · Issue #74 · gajus/write-file-webpack-plugin · GitHub](https://github.com/gajus/write-file-webpack-plugin/issues/74)  
return config;  
};

const addDevServerCOOPReponseHeader = (config) =\> {  
config.headers = {  
…config.headers,  
“Cross-Origin-Embedder-Policy”: “require-corp”,  
“Cross-Origin-Opener-Policy”: “same-origin”  
}  
return config  
}

module.exports = {  
plugins: [  
new CopyPlugin({  
patterns: [{  
from: ‘node\_modules/zoom/videosdk/dist/lib’,  
to: ‘dest/zoom-libs’ // The destination folder, which you can rename as you wish  
}  
],  
})  
]  
}

4.) Add angular builders and change angular.json  
“architect”: {  
“build”: {  
//“builder”: “@angular-devkit/build-angular:browser”,  
“builder”: “@angular-builders/custom-webpack:browser”, //Add this and run ng build  
“options”: {  
“customWebpackConfig”: {  
“path”: “./custom-webpack.config.js”  
},

…  
…

“serve”: {  
//“builder”: “@angular-devkit/build-angular:dev-server”,  
“builder”: “@angular-builders/custom-webpack:dev-server”, add this and after build run ng serve

- Device: Desktop
- OS: Windows 10
- Browser: Chrome
- Browser Version: Version 91.0.4472.124 (Official Build) (64-bit)

Please note this is a personal account and not the account tied to my work application.

---

<div class="post-metadata">

**Author:** ![dataonedigital](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/dataonedigital/32/17706_2.png) [@dataonedigital](https://devforum.zoom.us/u/dataonedigital)\
**Post date:** [July 14, 2021, 5:36pm UTC](https://devforum.zoom.us/t/depedent-assets-are-not-accessible-when-running-client-init-in-angular-12/54150/2 "2021-07-14T17:36:48Z")

</div>

I got the init working by simply creating a new demo angualr app and setting the \_CLIENT.init to  
\_CLIENT.init(‘en-US’, ‘[http://localhost:4200/assets/lib](http://localhost:4200/assets/lib)’);

im guessing messing around with webpack and config settings must have messed something up.

---

<div class="post-metadata">

**Author:** ![tommy](https://sea2.discourse-cdn.com/flex016/user_avatar/devforum.zoom.us/tommy/32/72769_2.png) [@tommy](https://devforum.zoom.us/u/tommy)\
**Post date:** [July 16, 2021, 4:16pm UTC](https://devforum.zoom.us/t/depedent-assets-are-not-accessible-when-running-client-init-in-angular-12/54150/3 "2021-07-16T16:16:02Z")

</div>

Hey @dataonedigital ,

Here is how you can do it with the `angular.json` file:

Within the `build` object, add this object to the `assets` object:

```auto
"assets": [
  "src/favicon.ico",
  "src/assets",
  {
    "glob": "**/*",
    "input": "./node_modules/@zoom/videosdk/dist/lib/",
    "output": "./node_modules/@zoom/videosdk/dist/lib/"
  }
],

```

With version 1.1.3, you can also use the new Dependent Asset CDN by setting the string to `Global`:

```auto
client.init('en-US', 'Global');

```

> **[Integrate SDK into your app - Getting started - Web - Video SDKs - Zoom...](https://marketplace.zoom.us/docs/sdk/video/web/build/integrate#zoom-video-sdk-cdn)**
>
> Integrate SDK into your app
> 
> 
> 
> Before using the Video SDK, you must:
> 
> Get an SDK key and secret for authentication. Login to the Zoom Marketplace and Cr...

[https://marketplace.zoom.us/docs/changelog#publications/video-sdk-web-v1-1-3](https://marketplace.zoom.us/docs/changelog#publications/video-sdk-web-v1-1-3)

Thanks,  
Tommy

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex016/uploads/zoomdeveloper/original/3X/6/1/614bdd549b610bbaa46ff934617683a02bdaa03c.png) [@system](https://devforum.zoom.us/u/system)\
**Post date:** [August 16, 2021, 2:16am UTC](https://devforum.zoom.us/t/depedent-assets-are-not-accessible-when-running-client-init-in-angular-12/54150/4 "2021-08-16T02:16:32Z")

</div>

Closed on August 16, 2021, 2:16am UTC

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.