I'm trying to learn how CI/CD pipelines work.
I decided to use it with my portfolio page which should re-run itself on every push.
Here is my yaml config:
name: Build Bundle for Github Pages
on:
push:
branches:
- source
env:
NODE_ENV: production
PUBLIC_URL: http://crrmacarse.github.io/
GA_TRACKING_CODE: ${{ secrets.GA_TRACKING_CODE }}
FIREBASE_TOKEN: ${{ secrets.FIREBASE_TOKEN }}
jobs:
build-and-deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v1
with:
persist-credentials: false
- name: Build
run: |
npm install
npm run prod:pipeline
npm run sitemap
cp dist/index.html dist/404.html
cp google21029c74dc702d92.html dist/
cp robots.txt dist/
- name: Deploy
uses: JamesIves/github-pages-deploy-action@releases/v3
with:
ACCESS_TOKEN: ${{ secrets.ACCESS_TOKEN }}
BRANCH: source
FOLDER: dist
Here is the error:

Source code for the webpack config: https://github.com/crrmacarse/crrmacarse.github.io/blob/source/compiler/production.pipeline.js
If the error message is cannot find module 'html-webpack-plugin', you could try, for testing, to install it.
See survivejs/webpack-book issue 100 as an example:
The solution was to run
npm i html-webpack-plugin --save-devbefore building with webpack
The OP has fixed the GitHub Action workflow with crrmacarse/crrmacarse.github.io commit 8a4397b
jobs:
publish:
runs-on: ubuntu-latest
steps:
- uses: actions/[email protected]
- name: Use node 12
uses: actions/setup-node@v1
with:
node-version: 12
registry-url: https://registry.npmjs.org
- name: install
run: npm install
- name: lint
run: npm run sitemap
- name: build
run: npm run prod
- name: copy
run: npm run copy
Then the module html-webpack-plugin is properly installed and available, as seen in this Actions CI run.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With