How do I deploy an AngularDart web page in Git Pages?


By default, Angular deploys pub serve with root/web/ as the root folder for index.html. GitHub (on the gh-pages branch) assumes it is in the root project folder.

Has anyone seen this done with a GitHub page? Would I be forced to convert the code from Dart to JS and use the GitHub folder structure?


So, this wasn’t the smoothest, but taking jonrsharpe’s advice (GitHub is for static web pages), I made sure to grab a dart2js transformer, throw that in my pubspec.yaml:

- $dart2js:
minify: true

and then ran pub build. That gave me the JS form of the web page in a build folder.

I already had - dart_to_js_script_rewriter in my pubspec, but I think that is used on the fly, using pub serve, to view in JS.

The non-smoothness comes from the fact that I moved those newly-built files into the root project folder (for GitHub) and had to append the project name to any file references in index.html:

  • /project/style.css
  • /project/main.dart.js

That produced a successful GitHub page (on gh-pages branch, of course).

Side note:
The Location and HashLocationStrategy are in there, but I don’t believe they are doing anything, other than compiling properly.

peanut does the dart2js build and copies the files into root without having to switch the gh-pages. Pretty nice. It appears to remove certain files and folders (like the README file) in the process, but it’s a decent little pub package.

Answered By – Lorax

Answer Checked By – Gilberto Lyons (FlutterFixes Admin)

Leave a Reply

Your email address will not be published. Required fields are marked *