Question 38536 in Ubuntu Question posted in
The official Ubuntu documentation can be found here.

Unable to deploy flutter project to Github Pages – Ubuntu

I can’t host flutter web application on github pages. The workflow file looks like this:

name: Build & Deploy weathunits_configurator

on:
  # Allows you to run this workflow manually from the Actions tab
  workflow_dispatch:

jobs:

  build-and-deploy:
    name: 'Build & Deploy web app'
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v3

      - name: 'Install Flutter and Dart SDK'
        uses: subosito/flutter-action@v2
        with:
          channel: stable
          flutter-version: 3.3.9
          cache: true

      - name: 'Flutter enable Web'
        run: flutter config --enable-web

      - name: 'Get dependencies'
        run: flutter pub get
        working-directory: example/weathunits_configurator

      - name: 'Build web app'
        run: |
          cd example/weathunits_configurator
          flutter build web --web-renderer=canvaskit --base-href='/weathunits_configurator/' --release
      
      - name: 'Deploy web app'
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: example/weathunits_configurator/build/web

What I’m trying to do: my project lies in the example/weathunits_configurator folder, after building it will be in the example/weathunits_configurator/build/web folder.

The web project is placed in the gh-pages branch and looks like this link.
Settings GitHub Pages in project

We open the application through the https://packruble.github.io/weather_animation/ (I’d like to see another path. Not /weather_animation/, but /weathunits_configurator/.) and see a blank screen. I see the following in the console brave:
in console brave

What I tried:

  1. Use JamesIves/github-pages-deploy-action@v4 instead of peaceiris/actions-gh-pages@v3
  2. Use different `flutter build web’ parameters
  3. Changed the input and output folder in settings deploy action.

I think the problem is that because my project, which needs to be deployed, is in a subfolder, it cannot be built normally. Either there is a problem with the --base-href='/weathunits_configurator/' tag. Or the problem is somewhere else.

How to launch this project on Github Pages?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    In the end, the problem was solved by using the --base-href='/weather_animation/' flag which specifies the repository name. It is the name of the github repository that should be specified in this flag and nothing else!

    Recall that the file on the path web/index.html has the following line <base href="$FLUTTER_BASE_HREF">.

    And yes, sometimes github pages are not lightning fast. You need to wait some time for the changes to take effect after your deploy.


  2. 0

    Consider the error message:

    Loading failed for the <script> with source 
“https://packruble.github.io/weathunits_configurator/flutter.js”.   
  weather_animation:40:1

    That means a base-href set to /weathunits_configurator/ cannot work because a project GitHub Page is based on the repository name.
    Here, it is weather_animation, not weathunits_configurator.

    The simplest option would be to rename the repository into weathunits_configurator, and remove the base-href, since a project site is hosted at http(s)://<username>.github.io/<repository>.

    That seems easier than configuring a custom domain for your GitHub Pages site.

    The OP Ruble confirms in the comments it is working, but keeping --base-href='/weather_animation/', using the name of the repository though.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search