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.
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:
What I tried:
Use JamesIves/github-pages-deploy-action#v4 instead of peaceiris/actions-gh-pages#v3
Use different `flutter build web' parameters
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?
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.
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.
Related
I've recently tried to deploy my 1st portfolio on github pages which is being built with Astro.js.
Everything looks as it should on dev mode, and the build doesn't start any errors, but when I access the page where my portfoli was deployed the images are not rendering. All the images are SVGs and I also have a video that plays on the backgroud which is in .mp4 format. For the HTML I'm using and tags for the images and the video respectively.
For deployment I followed Astro's documentation
And basicly coipied they're yaml file.
.github/workflows/main.yaml:
name: Deploy Astro to GitHub Pages
on:
# Trigger the workflow every time you push to the `main` branch
# Using a different branch name? Replace `main` with your branch’s name
push:
branches: [ main ]
# Allows you to run this workflow manually from the Actions tab on GitHub.
workflow_dispatch:
# Allow this job to clone the repo and create a page deployment
permissions:
contents: read
pages: write
id-token: write
jobs:
build:
runs-on: ubuntu-latest
steps:
- name: Checkout your repository using git
uses: actions/checkout#v2
- name: Install, build, and upload your site
uses: withastro/action#v0
with:
# path: . # The root location of your Astro project inside the repository. (optional)
# node-version: 16 # The specific version of Node that should be used to build your site. Defaults to 16. (optional)
package-manager: npm # The Node package manager that should be used to install dependencies and build your site. Automatically detected based on your lockfile. (optional)
deploy:
needs: build
runs-on: ubuntu-latest
environment:
name: github-pages
url: ${{ steps.deployment.outputs.page_url }}
steps:
- name: Deploy to GitHub Pages
id: deployment
uses: actions/deploy-pages#v1
For more detailed information you can find
the deployed page here
src code here
EDIT: clearly I didn't read the documents well enough as the error was solved by this warning warning
For a complete answer, and in addition to the base config that you mentioned in your question, as you're using github pages for deployment, it is important to add a .nojekyll file in your /public/ directory or ensure it is placed in your repo root or the static folder to be deployed by github
references :
base : https://docs.astro.build/en/reference/configuration-reference/#base
bypassing Jekyll on Github Pages : https://github.blog/2009-12-29-bypassing-jekyll-on-github-pages/
I have a Google Chrome and Mozilla Firefox extension in a same GitHub repository. They are separated in two branches and I am "exposing" the original URL to download the repository for each branch:
The approach to install a Firefox extension is quite long and messy since it needs to be unzipped and zipped again. So, someone recommended me using Github actions to create a release file from specific branches using this Github action: Zip Release.
According to their documentation I have tried to replicate the YAML file for my use case using the Github action creation wizard and naming that file firefox.yml that created a folder in the repository root: .github/workflows/firefox.yml:
name: Create Archive
on: [push]
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: my-user/the-repo#dev-firefox
- name: Create Firefox Release
uses: thedoctor0/zip-release#main
with:
type: 'zip'
filename: 'dev-firefox.zip'
path: './releases'
exclusions: '*.git* /*node_modules/* .editorconfig /*releases/*'
But after it starts it immediately fails with the following message:
Can't find 'action.yml', 'action.yaml' or 'Dockerfile' under '/home/runner/work/_actions/my-user/the-repo/dev-firefox'. Did you forget to run actions/checkout before running your local action?
I also tried adding - uses: actions/checkout#master just before the line - uses my-user/the-repo#dev-firefox but it won't work.
Not sure how to properly write the workflow YAML configuration. Any suggestions?
You're confusing uses with checking out a repository. uses indicates an action to use, with the part after the # specifying the version of the action. To check out a specific branch of your repo, you can use the checkout action with the ref parameter:
steps:
- uses: actions/checkout#v3.1.0
with:
ref: dev-firefox
I would like to push a build that was completed on a GitHub action workflow using this code:
name: Build
on: [pull_request, push]
jobs:
build:
runs-on: windows-latest
steps:
- name: Checkout the code
uses: actions/checkout#v2
- name: Build the app
run: ./gradlew build
Currently this works for building the app and updating a status badge, but I would like the apk file from this build to be pushed directly as a pre-release. Is this possible?
Yes, it is possible.
If you want to make a GitHub release containing the file, there are a lot of GitHub actions. This action - automatic-releases, I think can do the work for you.
This action simplifies the GitHub release process by automatically uploading assets, generating changelogs, handling pre-releases, and so on.
As I see you use Gradle, you can check the GitHub docs for publishing-java-packages-with-gradle
I have a simple react app that I am trying to deploy to azure web app. Some key points.
Web App is already configured in Azure.
Publish Profile of the Web App is already included in the GitHub Repository
I am using the following GitHub workflow code.
on: push
env:
AZURE_WEBAPP_NAME: ReactJSRecipeAppGitHubActionsOct12020 # set this to your application's name
AZURE_WEBAPP_PACKAGE_PATH: '.' # set this to the path to your web app project, defaults to the repository root
NODE_VERSION: '10.x' # set this to the node version to use
jobs:
build-and-deploy:
name: Build and Deploy
runs-on: ubuntu-latest
steps:
- uses: actions/checkout#v2
- name: Use Node.js ${{ env.NODE_VERSION }}
uses: actions/setup-node#v1
with:
node-version: ${{ env.NODE_VERSION }}
- name: npm install, build, and test
run: |
# Build and test the project, then
# deploy to Azure Web App.
npm install
npm run build --if-present
npm run test --if-present
- name: 'Deploy to Azure WebApp'
uses: azure/webapps-deploy#v2
with:
app-name: ${{ env.AZURE_WEBAPP_NAME }}
publish-profile: ${{ secrets.AZURE_WEBAPP_PUBLISH_PROFILE }}
package: ${{ env.AZURE_WEBAPP_PACKAGE_PATH }}
The entire workflow runs without any problems. everything is green. Both the code and the deploy job is public. You can see the whole thing here - https://github.com/Jay-study-nildana/APIServerDotNetCoreGitActionsCICD
Unfortunately, this does not work, because, the 'build' folder, which contains the actual website to be served does not get deployed at the root of the website.
in the current state, the entire root of the repository, gets deployed to the target web app, including the build folder. If I open the KUDU console, I can see the build folder and all the contents of the site.
So, the issue is, how do I get the above workflow, to put the contents of the 'build' folder, and not the whole repo?
Also, please, note the following.
I have tried the following different options for the AZURE_WEBAPP_PACKAGE_PATH variable, and none of them work.
'/build'
'./build/.'
/build'
'./build/'
You can achieve your requirement by using one of below formats:
build
./build
The build folder will be generated at the root of working directory after npm run build run successfully. So you need specify build or ./build as AZURE_WEBAPP_PACKAGE_PATH value to retrieve the build folder contents.
On top of the changes listed to send the build folder:
You can check that you have uploaded the files correctly by installing the vscode plugin and then logging in you will be able to see the files that are on the server.
This will confirm that the build file uploaded correctly.
Now, go back to portal.azure.com
Settings > General settings > Startup Command
add the following to serve the index.html from the build file.
pm2 serve /home/site/wwwroot/ --no-daemon --spa
link:
https://stackoverflow.com/a/61386411/5283424
I just started to migrate all my GitLab repositories to GitHub. I wasn't using GitHub for a while so I stumbled over the - at least for me new feature - GitHub Actions.
Since I just started a new project, I wanted to use GitHub Actions for build and deploy my new application. I've really no idea what I'm doing wrong, I'll attach my workflow file below.
What I want to achieve is, everytime I push to a branch that's not my master and that hasn't the prefix 'release/', I want to execute this build and deploy for my development system. Later I will also setup the same script but for a staging (pre production) system ONLY if I push into a branch with the prefix 'release/' and indeed the same a thrid time for production for the master branch only.
What I'm wondering about is, the actions get - at least for my understanding - executed sporadically. I want an behaviour like I had in GitLab: Everytime I push a feature branch or whatever from my local working machine, the development pipeline should get executed. Then I'll create a pull request. Only if the pipeline was successful, I want to be able to merge. After the merge into a branch (for example feature/... into develop), I would like to automatically execute the pipeline for development.
I'm not even sure if this is possible. Maybe I also didn't understood the concept of actions correctly.
name: Publish Development
on:
push:
branches:
- '**'
- '!master'
- '!release/**'
pull_request:
branches:
- '**'
- '!master'
- '!release/**'
jobs:
build-and-deploy:
name: Build and Deploy
runs-on: ubuntu-latest
steps:
- name: check out repository
uses: actions/checkout#v2
with:
token: ${{ secrets.PRIVATE_ACCESS_TOKEN}}
- name: install dependencies
run: npm install
- name: install dependencies
run: npm --prefix ./functions install ./functions
- name: deploy to firebase
uses: w9jds/firebase-action#master
with:
args: deploy
env:
FIREBASE_TOKEN: ${{ secrets.FIREBASE_TOKEN }}
PROJECT_ID: ${{ secrets.FIREBASE_PROJECT_ID }}
Thanks!
EDIT: Well it turned out that I just started to try new technology during some service interruption. GitHub was experiencing some issues in their infrastructure. Its working now as expected.
Well it turned out that I just started to try new technology during some service interruption. GitHub was experiencing some issues in their infrastructure. Its working now as expected.