Add package-bundlers job to CI workflow for testing library with mult… #14
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| name: CI | |
| on: | |
| push: | |
| branches: [ main, master ] | |
| pull_request: | |
| branches: [ main, master ] | |
| jobs: | |
| typecheck: | |
| runs-on: ubuntu-latest | |
| strategy: | |
| matrix: | |
| typescript: ['4.9', '5.0', '5.1', '5.2', '5.3', '5.4'] | |
| steps: | |
| - name: Checkout code | |
| uses: actions/checkout@v4 | |
| - name: Setup Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: '20' | |
| cache: 'npm' | |
| - name: Install dependencies | |
| run: npm ci | |
| - name: Install specific TypeScript version | |
| run: npm install --save-dev typescript@${{ matrix.typescript }} | |
| - name: Build with TypeScript ${{ matrix.typescript }} | |
| run: npm run build | |
| test-matrix: | |
| runs-on: ubuntu-latest | |
| strategy: | |
| fail-fast: false | |
| matrix: | |
| node: ['18', '20', '22'] | |
| react: ['18.3.1', '19.1.0'] | |
| steps: | |
| - name: Checkout code | |
| uses: actions/checkout@v4 | |
| - name: Setup Node.js ${{ matrix.node }} | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: ${{ matrix.node }} | |
| cache: 'npm' | |
| - name: Install dependencies | |
| run: npm ci | |
| - name: Install React ${{ matrix.react }} | |
| run: npm i -D react@${{ matrix.react }} react-dom@${{ matrix.react }} | |
| - name: Build library | |
| run: npm run build | |
| - name: Run tests | |
| run: npm run test:ci | |
| package-consumption: | |
| runs-on: ubuntu-latest | |
| steps: | |
| - name: Checkout code | |
| uses: actions/checkout@v4 | |
| - name: Setup Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: '20' | |
| cache: 'npm' | |
| - name: Install dependencies | |
| run: npm ci | |
| - name: Build library | |
| run: npm run build | |
| - name: Create test consumer packages | |
| run: | | |
| # Test ESM consumption | |
| mkdir -p test-consumption/esm-consumer | |
| cd test-consumption/esm-consumer | |
| npm init -y | |
| npm install ../../ | |
| echo 'import { initAppDb, dispatch } from "@flexsurfer/reflex"; console.log("ESM import works");' > test.mjs | |
| node test.mjs | |
| # Test CommonJS consumption | |
| cd ../ | |
| mkdir -p cjs-consumer | |
| cd cjs-consumer | |
| npm init -y | |
| npm install ../../ | |
| echo 'const { initAppDb, dispatch } = require("@flexsurfer/reflex"); console.log("CommonJS require works");' > test.js | |
| node test.js | |
| example-todomvc: | |
| runs-on: ubuntu-latest | |
| steps: | |
| - name: Checkout code | |
| uses: actions/checkout@v4 | |
| - name: Setup Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: '20' | |
| cache: 'npm' | |
| - name: Install root dependencies (for local lib alias) | |
| run: npm ci | |
| - name: Install example dependencies | |
| working-directory: examples/todomvc | |
| run: npm ci | |
| - name: Build TodoMVC example | |
| working-directory: examples/todomvc | |
| run: npm run build | |
| - name: Run TodoMVC tests | |
| working-directory: examples/todomvc | |
| run: npm run test | |
| publish-dry-run: | |
| runs-on: ubuntu-latest | |
| if: github.event_name == 'push' && github.ref == 'refs/heads/main' | |
| steps: | |
| - name: Checkout code | |
| uses: actions/checkout@v4 | |
| - name: Setup Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: '20' | |
| cache: 'npm' | |
| - name: Install dependencies | |
| run: npm ci | |
| - name: Build library | |
| run: npm run build | |
| - name: Run tests | |
| run: npm run test:ci | |
| - name: Test package publication | |
| run: npm pack --dry-run | |
| - name: Test TodoMVC example build | |
| run: | | |
| cd examples/todomvc | |
| npm ci | |
| npm run build | |
| package-bundlers: | |
| runs-on: ubuntu-latest | |
| strategy: | |
| fail-fast: false | |
| matrix: | |
| bundler: [vite, webpack, rollup, esbuild] | |
| steps: | |
| - name: Checkout code | |
| uses: actions/checkout@v4 | |
| - name: Setup Node.js | |
| uses: actions/setup-node@v4 | |
| with: | |
| node-version: '20' | |
| cache: 'npm' | |
| - name: Install dependencies | |
| run: npm ci | |
| - name: Build library | |
| run: npm run build | |
| - name: Pack library | |
| run: npm pack --filename reflex.tgz | |
| - name: Test with ${{ matrix.bundler }} | |
| run: | | |
| # Create test directory | |
| mkdir -p bundler-test | |
| cd bundler-test | |
| # Initialize consumer project | |
| npm init -y | |
| # Install peer dependencies | |
| npm install react@18 react-dom@18 | |
| # Install the packed library | |
| npm install ../reflex.tgz | |
| # Create entry file that imports from the library | |
| cat > index.js << 'EOF' | |
| import { initAppDb } from "@flexsurfer/reflex"; | |
| console.log("Successfully imported initAppDb:", typeof initAppDb); | |
| console.log("Library bundled successfully!"); | |
| EOF | |
| # Configure bundler-specific setup and build | |
| case "${{ matrix.bundler }}" in | |
| vite) | |
| npm install --save-dev vite | |
| cat > vite.config.js << 'EOF' | |
| export default { | |
| build: { | |
| lib: { | |
| entry: 'index.js', | |
| formats: ['es'], | |
| fileName: 'bundle' | |
| } | |
| } | |
| } | |
| EOF | |
| npx vite build | |
| ;; | |
| webpack) | |
| npm install --save-dev webpack webpack-cli | |
| cat > webpack.config.js << 'EOF' | |
| const path = require('path'); | |
| module.exports = { | |
| entry: './index.js', | |
| output: { | |
| filename: 'bundle.js', | |
| path: path.resolve(__dirname, 'dist'), | |
| library: { type: 'commonjs2' } | |
| }, | |
| mode: 'production', | |
| resolve: { | |
| extensions: ['.js'] | |
| } | |
| }; | |
| EOF | |
| npx webpack --mode=production | |
| # Test execution of bundled output | |
| node dist/bundle.js | |
| ;; | |
| rollup) | |
| npm install --save-dev rollup @rollup/plugin-node-resolve @rollup/plugin-commonjs | |
| cat > rollup.config.js << 'EOF' | |
| import { nodeResolve } from '@rollup/plugin-node-resolve'; | |
| import commonjs from '@rollup/plugin-commonjs'; | |
| export default { | |
| input: 'index.js', | |
| output: { | |
| file: 'dist/bundle.js', | |
| format: 'cjs' | |
| }, | |
| plugins: [nodeResolve(), commonjs()] | |
| }; | |
| EOF | |
| npx rollup -c | |
| # Test execution of bundled output | |
| node dist/bundle.js | |
| ;; | |
| esbuild) | |
| npm install --save-dev esbuild | |
| npx esbuild index.js --bundle --outfile=dist/bundle.js --format=cjs --platform=node | |
| # Test execution of bundled output | |
| node dist/bundle.js | |
| ;; | |
| esac |