How can I include web.config in Ionic build?

Ionic Framework ionic-v3
1

I have to include web.config file to specify some behavior for static files on Azure hosting. I added file under /src folder in Ionic 3 application, but I can’t see it in platforms/browser/www in the end.

Is there workaround for this ?

2

Is it a must to have this file at the root www of your app?

If no, couldn’t you drop it into src/assets (deployed to www/assets)?

3

It must be in root only.

4

Oki doki, then you could maybe achieve what you want by overriding the config of ionic-app-scripts

For example (I would suggest to try)

1-Overwrite locally copy.config.js from app-scripts respectively do a local copy of https://github.com/ionic-team/ionic-app-scripts/blob/master/config/copy.config.js

2-Add your web.config file to the list of files of the property (inside copy.config.js)copyIndexContent

3-In your package.json specifiy where your local config is, like for example

"config": {
        "ionic_copy": "./scripts/copy.config.js"
        "ionic_source_map_type": "source-map"
 }

If you do so, don’t forget time to time, when you upgrade app-scripts, if they made changes in the file you would have override to copy the changes locally too.

1 Like
5

That’s really nice start of a day :smile:

Thank you so much !

1 Like
6

You’re welcome, glad to hear it worked out :slight_smile:

7

One more question :slight_smile: is it possible in your solution to use a condition to allow external configuration: "ionic_copy": "./scripts/copy.config.js"

only when IONIC_ENV === 'prod' : npm run ionic:build --prod

8

Honestly, I don’t know.

After I read your question I went to the README of app-scripts and found the following, maybe it’s something you could analyze deeper

Command-line Flags
Remember how we’re actually running ionic-app-scripts from the scripts property of a project’s package.json file? Well we can also add command-line flags to each script, or make new scripts with these custom flags. For example:

“scripts”: {
“build”: “ionic-app-scripts build --webpack ./config/webpack.dev.config.js”,
“minify”: “ionic-app-scripts minify --cleancss ./config/cleancss.config.js”,
},
The same command-line flags can be also applied to npm run commands too, such as:

npm run build --webpack ./config/webpack.dev.config.js

1 Like
9

Thanks for the idea! My final solution is following:

I added configuration file to ./config/copy.config.js and instead of referencing it in package.json, I injected command line parameter for production builds:

npm run ionic:build --prod --copy ./config/copy.config.js

1 Like