Flutter web base href subfolder

5,795

Solution 1

I've got a similar problem after upgrading flutter and dart to current version (beta channel), I mean it was good on debugging mode and It did not working on build release. What I did? I just commented this <base href="/"> line at index.html file (located inside the <your_app_folder_name>/web folder) and both (debugging and release builds) went back to working like charm.

I did comment by changing the line

<base href="/">

to

<!-- <base href="/"> -->

Do the change and: try to run a flutter build web command, copy the generated web folder located at <your_app_folder_name>/build/ path to any subfolder (such as <your_websrv_root>/webtestfolder) of the your webserver, and it will work at the address http://webtestfolder of your browser.

Solution 2

The answer is in the index.html file on the web folder (not /build/web)

<!DOCTYPE html>
<html>
<head>
  <!--
    If you are serving your web app in a path other than the root, change the
    href value below to reflect the base path you are serving from.

    The path provided below has to start and end with a slash "/" in order for
    it to work correctly.

    For more details:
    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
  -->
  <base href="/sub-folder/">

  <meta charset="UTF-8">
  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
Share:
5,795
GnRSlashSP
Author by

GnRSlashSP

BY DAY: Work in a Japanese multinational company, developing softwares and systems, drivers, industrial automation softwares, communication protocols, manufacturing automation softwares and a lot of things like these BY NIGHT: play games, create Minecraft Mods, read blogs, foruns, always trying to learn something interesting about games or programming, trying to learn android programming, Unity 3D development and other stuffs like these.

Updated on November 27, 2022

Comments

  • GnRSlashSP
    GnRSlashSP over 1 year

    I am trying to deploy to IIS. Not in root but in a sub-folder. This is working:

    • edit web/index.html, change <base href="/"> to <base href="/ChangeTag/">
    • run flutter build web command
    • the build/web/index.html is ok, with the new changes.

    Perfect!

    BUT, when I try to debug using localhost: web pages does not found - error 404

    What I want is to deploy (automatically), inside a sub-folder of wwwroot and execute local test too, without modifying index.html a lot of times

    Is it possible to do something like in Angular, use proxies, use different build configs, etc?

    Thanks