How to update index.html file to add static to its path during build process?

Question

I want to add /static/ in front of all the paths in index.html. Since Flask looks for static files inside the /root_folder/static folder. Even though I have placed all the files inside the static folder, it is unable to get the files as the path in the index.html file is not correct.

My current directory structure in Flask looks like this

web_ui
    src
       -static
       -web_app.py
    logs
    config

This is what the path to various files in index.html looks like.

  <script src="assets/js/apexcharts.min.js"></script>
  <script src="assets/js/bootstrap.bundle.min.js"></script>

I would like to have

  <script src="/static/assets/js/apexcharts.min.js"></script>
  <script src="/static/assets/js/bootstrap.bundle.min.js"></script>

is there any way to change the angular.json file? I have changed the output directory

"architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "../web_ui/src/static/",  #<----
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "tsconfig.app.json",
            "assets": [
              "src/favicon.ico",
              "src/assets"
            ],
            "styles": [
              "src/custom-theme.scss",
              "src/styles.css"
            ],
            "scripts": [
              "src/assets/js/main.js",
              "node_modules/apexcharts/dist/apexcharts.min.js"
            ]

I have looked into this answer but the person has not explained how to do it. Do I have to manually change the path?

Krishnan Shankar · Accepted Answer · 2023-07-05 01:42:13Z

-1

Not sure if there's an Angular way to do this, but there is a Flask way to change the directory where static files are loaded. See this.

app = Flask(__name__, static_folder="")  # Not "static"

edited Jul 5, 2023 at 1:42

answered Jul 5, 2023 at 0:42

Krishnan Shankar

1,01715 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Sam Over a year ago

this will not work with angular as index.html is dynamically generated during the build process and you are not supposed to manually edit it.

Collectives™ on Stack Overflow

How to update index.html file to add static to its path during build process?

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related