I am trying to figure out how to dynamically set the deployUrl during runtime in Angular

Question

I am trying to figure out how to dynamically set the deployUrl during runtime in Angular

When working with Angular, the definition of "webpack_public_path" or "webpack_require.p" for a project can be done in multiple ways:

By setting the deployUrl in the .angular-cli.json file
By adding --deployUrl "some/path" to the "ng build" command line

However, there is a need to dynamically set this value so that it is fetched from the assets/config.json file when the application starts. One possible approach is as follows, potentially defined in the main.ts file, yet all attempts have failed:

__webpack_require__.p=window.config['deployUrl'];

If anyone knows how to achieve this, any guidance would be highly appreciated! Thank you!

javascript json angular typescript webpack

Answer 1

Answer №1

Upon digging deeper, it was discovered that the solution provided for the query "How can I dynamically set the public path in Webpack?" did indeed yield positive results. Initially, there were difficulties encountered when attempting to implement this method, but after a subsequent attempt, success was achieved.

The key distinction was omitting the creation of a globals.d.ts file for inserting the declare statement; instead, I directly inserted the following lines into my main.ts file:

declare var  __webpack_public_path__:string;
__webpack_public_path__= 'public/path/location';

It remains uncertain whether this approach adheres to best practices...

Answer 2

Upon digging deeper, it was discovered that the solution provided for the query "How can I dynamically set the public path in Webpack?" did indeed yield positive results. Initially, there were difficulties encountered when attempting to implement this method, but after a subsequent attempt, success was achieved.

The key distinction was omitting the creation of a globals.d.ts file for inserting the declare statement; instead, I directly inserted the following lines into my main.ts file:

declare var  __webpack_public_path__:string;
__webpack_public_path__= 'public/path/location';

It remains uncertain whether this approach adheres to best practices...

I am trying to figure out how to dynamically set the deployUrl during runtime in Angular

Answer №1

Similar questions

Which is more efficient: Implementing caching on the frontend or on the

The cropper fails to load within the image element inside a modal pop-up

The input 'Element' does not match the expected parameter 'ReactElement<any>' in this context

Employing the validateAll() function in conjunction with a personalized v-select component within the scope

Implementing JavaScript Code in TypeScript

Link up each query with every php echo

Unable to modify the properties of a stateless child component

Iterate through each element in the array and manipulate the corresponding data

Get numerous records from two sets of data

``Why Ionic 3 Popover Sizes Should Adapt to Different Screen

Utilizing a fixed array as the data source for a mat-table

The necessity of the second parameter, inverseSide property in TypeORM's configurations, even though it is optional

In what way does the map assign the new value in this scenario?

The JSON appears to be fine, but encountering an error during parsing

Having trouble obtaining Json on my Android device

Refreshing the sub attributes of an incomplete entity

Initiate Action Upon Visibility

Generate app registration in Azure Active Directory by automatically setting up credentials using the administrator's username and password

What is causing the return statement to not function properly in the Mongoose findOne method?

The functionality of async.series and async.each is not behaving as anticipated