From 12171d15c1b8b8faf6bd98c4794541e70c980327 Mon Sep 17 00:00:00 2001 From: Luke Bermingham <1215582+lukehb@users.noreply.github.com> Date: Thu, 16 Feb 2023 14:31:16 +1000 Subject: [PATCH 1/2] Move webpack config to prod instead of dev --- Frontend/implementations/EpicGames/webpack.config.js | 10 +++++++--- Frontend/library/webpack.config.js | 11 +++++++---- 2 files changed, 14 insertions(+), 7 deletions(-) diff --git a/Frontend/implementations/EpicGames/webpack.config.js b/Frontend/implementations/EpicGames/webpack.config.js index cd91b659..6e8cc11c 100644 --- a/Frontend/implementations/EpicGames/webpack.config.js +++ b/Frontend/implementations/EpicGames/webpack.config.js @@ -12,7 +12,7 @@ const pages = fs.readdirSync('./src', { withFileTypes: true }) module.exports = (env) => { return { - mode: 'development', + mode: 'production', entry: pages.reduce((config, page) => { config[page] = `./src/${page}.ts`; return config; @@ -28,7 +28,7 @@ module.exports = (env) => { chunks: [page], }), )), // turn off so we can see the source map for dom delegate so we can debug the library - devtool: 'inline-source-map', + module: { rules: [ { @@ -74,12 +74,16 @@ module.exports = (env) => { futureDefaults: true }, optimization: { - minimize: false + minimize: true }, devServer: { static: { directory: path.join(__dirname, '../../../SignallingWebServer/Public'), }, + }, + stats: 'none', + performance: { + hints: false } }; } diff --git a/Frontend/library/webpack.config.js b/Frontend/library/webpack.config.js index c1f47034..b153f757 100644 --- a/Frontend/library/webpack.config.js +++ b/Frontend/library/webpack.config.js @@ -5,11 +5,10 @@ const path = require('path'); const webpack = require('webpack'); module.exports = { - mode: 'development', + mode: 'production', entry: { index: './src/pixelstreamingfrontend.ts' }, - devtool: 'inline-source-map', module: { rules: [ { @@ -36,7 +35,11 @@ module.exports = { globalObject: 'this' }, optimization: { - minimize: false + minimize: true, + usedExports: true, }, - stats: 'errors-only' + stats: 'errors-only', + performance: { + hints: false + } }; From 92dd46dfc1798e94fdeaeeb7c31ab5a7d4600fe3 Mon Sep 17 00:00:00 2001 From: Luke Bermingham <1215582+lukehb@users.noreply.github.com> Date: Fri, 17 Feb 2023 18:03:37 +1000 Subject: [PATCH 2/2] Bring Github actions to 5.2 branch (#105) * Added dev and prod configs to webpack (#102) * Adding github actions to create an NPM package for frontend library and make a release for the repo (#103) * Added workflow file for pushing library to npm * Added workflow file for making a release with built implementation/EpicGames archives --- .github/workflows/container-images.yml | 31 ++++ .github/workflows/create-gh-release.yml | 73 ++++++++ .../workflows/publish-library-to-npm.yml | 6 +- .../implementations/EpicGames/package.json | 10 +- .../{webpack.config.js => webpack.common.js} | 160 ++++++++---------- .../implementations/EpicGames/webpack.dev.js | 10 ++ .../implementations/EpicGames/webpack.prod.js | 16 ++ Frontend/library/package.json | 7 +- .../{webpack.config.js => webpack.common.js} | 11 +- Frontend/library/webpack.dev.js | 15 ++ Frontend/library/webpack.prod.js | 16 ++ RELEASE_VERSION | 2 +- 12 files changed, 253 insertions(+), 104 deletions(-) create mode 100644 .github/workflows/container-images.yml create mode 100644 .github/workflows/create-gh-release.yml rename Frontend/.github/workflows/release.yml => .github/workflows/publish-library-to-npm.yml (79%) rename Frontend/implementations/EpicGames/{webpack.config.js => webpack.common.js} (64%) create mode 100644 Frontend/implementations/EpicGames/webpack.dev.js create mode 100644 Frontend/implementations/EpicGames/webpack.prod.js rename Frontend/library/{webpack.config.js => webpack.common.js} (79%) create mode 100644 Frontend/library/webpack.dev.js create mode 100644 Frontend/library/webpack.prod.js diff --git a/.github/workflows/container-images.yml b/.github/workflows/container-images.yml new file mode 100644 index 00000000..39b200bc --- /dev/null +++ b/.github/workflows/container-images.yml @@ -0,0 +1,31 @@ +name: Publish the Signalling Server container image from our dev branch + +on: + push: + branches: ['UE5.2'] + paths: ['SignallingWebServer/**'] + +jobs: + signalling-server-image: + runs-on: ubuntu-latest + permissions: + contents: read + packages: write + steps: + - + name: Checkout + uses: actions/checkout@v3 + - + name: Login to GitHub Container Registry + uses: docker/login-action@v2 + with: + registry: ghcr.io + username: ${{ github.actor }} + password: ${{ secrets.GITHUB_TOKEN }} + - + name: Build and push the Signalling Server container image for Unreal Engine based on our development branch + uses: docker/build-push-action@v3 + with: + context: ./SignallingWebServer + tags: 'ghcr.io/epicgames/pixel-streaming-signalling-server:dev' + push: true diff --git a/.github/workflows/create-gh-release.yml b/.github/workflows/create-gh-release.yml new file mode 100644 index 00000000..bac6dfec --- /dev/null +++ b/.github/workflows/create-gh-release.yml @@ -0,0 +1,73 @@ +name: Releases + +on: + push: + branches: ['UE5.2'] + paths: ['RELEASE_VERSION'] + +jobs: + + build: + runs-on: ubuntu-latest + defaults: + run: + working-directory: ./ + + permissions: + contents: write + steps: + - name: "Checkout source code" + uses: actions/checkout@v3 + + - name: Read the RELEASE_VERSION file + id: getversion + run: echo "version=$(cat RELEASE_VERSION)" >> $GITHUB_OUTPUT + + - uses: actions/setup-node@v3 + with: + node-version: '16.x' + registry-url: 'https://registry.npmjs.org' + + - name: Install library deps + working-directory: ./Frontend/library + run: npm ci + + - name: Build frontend lib + working-directory: ./Frontend/library + run: npm run build + + - name: Install implementations/EpicGames deps + working-directory: ./Frontend/implementations/EpicGames + run: npm ci + + - name: Build implementations/EpicGames + working-directory: ./Frontend/implementations/EpicGames + run: npm run build-all + + - name: Make output directory for archives + run: mkdir output + + - name: Archive Release tar.gz + uses: thedoctor0/zip-release@0.7.1 + with: + directory: './output' + path: '../' + type: 'tar' + filename: '${{ github.ref_name }}-${{ steps.getversion.outputs.version }}.tar.gz' + exclusions: '.git .github output Frontend/Docs Frontend/library/dist Frontend/library/types Frontend/library/node_modules Frontend/implementations/EpicGames/node_modules' + + - name: Archive Release tar.gz + uses: thedoctor0/zip-release@0.7.1 + with: + directory: './output' + path: '../' + type: 'zip' + filename: '${{ github.ref_name }}-${{ steps.getversion.outputs.version }}.zip' + exclusions: '*.git* /*node_modules/* .editorconfig /*types/* /*dist/* /*output/* /*Docs/*' + + - name: "Make the release" + uses: ncipollo/release-action@v1 + with: + tag: "${{ github.ref_name }}-${{ steps.getversion.outputs.version }}" + artifacts: "output/${{ github.ref_name }}-${{ steps.getversion.outputs.version }}.zip,output/${{ github.ref_name }}-${{ steps.getversion.outputs.version }}.tar.gz" + generateReleaseNotes: true diff --git a/Frontend/.github/workflows/release.yml b/.github/workflows/publish-library-to-npm.yml similarity index 79% rename from Frontend/.github/workflows/release.yml rename to .github/workflows/publish-library-to-npm.yml index 562813ed..40d724e1 100644 --- a/Frontend/.github/workflows/release.yml +++ b/.github/workflows/publish-library-to-npm.yml @@ -1,14 +1,14 @@ name: Publish library package to npmjs on: push: - tags: - - '*' + branches: ['UE5.2'] + paths: ['Frontend/library/package.json'] jobs: build: runs-on: ubuntu-latest defaults: run: - working-directory: ./library + working-directory: Frontend/library steps: - uses: actions/checkout@v3 - uses: actions/setup-node@v3 diff --git a/Frontend/implementations/EpicGames/package.json b/Frontend/implementations/EpicGames/package.json index 9a240ce2..67407a76 100644 --- a/Frontend/implementations/EpicGames/package.json +++ b/Frontend/implementations/EpicGames/package.json @@ -4,11 +4,15 @@ "description": "", "main": "player.ts", "scripts": { - "build": "npx webpack", + "build": "npx webpack --config webpack.prod.js", + "build-dev": "npx webpack --config webpack.dev.js", "watch": "npx webpack --watch", - "serve": "webpack serve", + "serve": "webpack serve --config webpack.dev.js", + "serve-prod": "webpack serve --config webpack.prod.js", "install": "cd ../../library && npm run build-webpack && cd ../implementations/EpicGames && npm link ../../library", - "build-all": "npm run install && npm run build" + "install-dev": "cd ../../library && npm run build-webpack-dev && cd ../implementations/EpicGames && npm link ../../library", + "build-all": "npm run install && npm run build", + "build-all-dev": "npm run install-dev && npm run build-dev" }, "devDependencies": { "webpack-cli": "^5.0.1", diff --git a/Frontend/implementations/EpicGames/webpack.config.js b/Frontend/implementations/EpicGames/webpack.common.js similarity index 64% rename from Frontend/implementations/EpicGames/webpack.config.js rename to Frontend/implementations/EpicGames/webpack.common.js index cd91b659..642185af 100644 --- a/Frontend/implementations/EpicGames/webpack.config.js +++ b/Frontend/implementations/EpicGames/webpack.common.js @@ -1,85 +1,75 @@ -// Copyright Epic Games, Inc. All Rights Reserved. - -const path = require('path'); -const HtmlWebpackPlugin = require('html-webpack-plugin'); -const webpack = require('webpack'); -const fs = require('fs'); - -const pages = fs.readdirSync('./src', { withFileTypes: true }) - .filter(item => !item.isDirectory()) - .filter(item => path.parse(item.name).ext === '.html') - .map(htmlFile => path.parse(htmlFile.name).name); - -module.exports = (env) => { - return { - mode: 'development', - entry: pages.reduce((config, page) => { - config[page] = `./src/${page}.ts`; - return config; - }, {}), - plugins: [ - new webpack.DefinePlugin({ - WEBSOCKET_URL: JSON.stringify((env.WEBSOCKET_URL !== undefined) ? env.WEBSOCKET_URL : '') - }), - ].concat(pages.map((page) => new HtmlWebpackPlugin({ - title: 'Development', - template: `./src/${page}.html`, - filename: `${page}.html`, - chunks: [page], - }), )), - // turn off so we can see the source map for dom delegate so we can debug the library - devtool: 'inline-source-map', - module: { - rules: [ - { - test: /\.tsx?$/, - loader: 'ts-loader', - exclude: [ - /node_modules/, - ], - }, - { - test: /\.html$/i, - use: 'html-loader' - }, - { - test: /\.css$/, - type: 'asset/resource', - generator: { - filename: 'css/[name][ext]' - } - }, - { - test: /\.(png|svg)$/i, - type: 'asset/resource', - generator: { - filename: 'images/[name][ext]' - } - }, - ], - }, - resolve: { - extensions: ['.tsx', '.ts', '.js', '.svg'], - }, - output: { - filename: '[name].js', - library: 'frontend', // change this to something more meaningful - libraryTarget: 'umd', - path: path.resolve(__dirname, '../../../SignallingWebServer/Public'), - clean: true, - globalObject: 'this', - hashFunction: 'xxhash64', - }, - experiments: { - futureDefaults: true - }, - optimization: { - minimize: false - }, - devServer: { - static: { - directory: path.join(__dirname, '../../../SignallingWebServer/Public'), - }, - } - }; -} +// Copyright Epic Games, Inc. All Rights Reserved. + +const path = require('path'); +const HtmlWebpackPlugin = require('html-webpack-plugin'); +const webpack = require('webpack'); +const fs = require('fs'); + +const pages = fs.readdirSync('./src', { withFileTypes: true }) + .filter(item => !item.isDirectory()) + .filter(item => path.parse(item.name).ext === '.html') + .map(htmlFile => path.parse(htmlFile.name).name); + +module.exports = { + entry: pages.reduce((config, page) => { + config[page] = `./src/${page}.ts`; + return config; + }, {}), + + plugins: [].concat(pages.map((page) => new HtmlWebpackPlugin({ + title: `${page}`, + template: `./src/${page}.html`, + filename: `${page}.html`, + chunks: [page], + }), )), + + module: { + rules: [ + { + test: /\.tsx?$/, + loader: 'ts-loader', + exclude: [ + /node_modules/, + ], + }, + { + test: /\.html$/i, + use: 'html-loader' + }, + { + test: /\.css$/, + type: 'asset/resource', + generator: { + filename: 'css/[name][ext]' + } + }, + { + test: /\.(png|svg)$/i, + type: 'asset/resource', + generator: { + filename: 'images/[name][ext]' + } + }, + ], + }, + resolve: { + extensions: ['.tsx', '.ts', '.js', '.svg', '.json'], + }, + output: { + filename: '[name].js', + library: 'epicgames-frontend', + libraryTarget: 'umd', + path: path.resolve(__dirname, '../../../SignallingWebServer/Public'), + clean: true, + globalObject: 'this', + hashFunction: 'xxhash64', + }, + experiments: { + futureDefaults: true + }, + devServer: { + static: { + directory: path.join(__dirname, '../../../SignallingWebServer/Public'), + }, + }, +} diff --git a/Frontend/implementations/EpicGames/webpack.dev.js b/Frontend/implementations/EpicGames/webpack.dev.js new file mode 100644 index 00000000..ee96e2fb --- /dev/null +++ b/Frontend/implementations/EpicGames/webpack.dev.js @@ -0,0 +1,10 @@ +// Copyright Epic Games, Inc. All Rights Reserved. + +const { merge } = require('webpack-merge'); +const common = require('./webpack.common.js'); +const path = require('path'); + +module.exports = merge(common, { + mode: 'development', + devtool: 'inline-source-map', +}); \ No newline at end of file diff --git a/Frontend/implementations/EpicGames/webpack.prod.js b/Frontend/implementations/EpicGames/webpack.prod.js new file mode 100644 index 00000000..bf27fe23 --- /dev/null +++ b/Frontend/implementations/EpicGames/webpack.prod.js @@ -0,0 +1,16 @@ +// Copyright Epic Games, Inc. All Rights Reserved. + +const { merge } = require('webpack-merge'); +const common = require('./webpack.common.js'); + +module.exports = merge(common, { + mode: 'production', + optimization: { + usedExports: true, + minimize: true + }, + stats: 'errors-only', + performance: { + hints: false + } +}); \ No newline at end of file diff --git a/Frontend/library/package.json b/Frontend/library/package.json index 707374dc..5c7ef13d 100644 --- a/Frontend/library/package.json +++ b/Frontend/library/package.json @@ -1,13 +1,14 @@ { "name": "@epicgames-ps/lib-pixelstreamingfrontend-dev", - "version": "0.0.1", + "version": "0.1.0", "description": "Frontend library for Pixel Streaming", - "main": "dist/lib-pixelstreamingfrontend.min.js", + "main": "dist/lib-pixelstreamingfrontend.js", "types": "types/pixelstreamingfrontend.d.ts", "scripts": { "compile": "tsc --build --clean && tsc", "build": "npm run build-webpack", - "build-webpack": "npx webpack", + "build-webpack": "npx webpack --config webpack.prod.js", + "build-webpack-dev": "npx webpack --config webpack.dev.js", "lint": "eslint . --ext .js,.jsx,.ts,.tsx", "spellcheck": "cspell \"{README.md,.github/*.md,src/**/*.ts}\"" }, diff --git a/Frontend/library/webpack.config.js b/Frontend/library/webpack.common.js similarity index 79% rename from Frontend/library/webpack.config.js rename to Frontend/library/webpack.common.js index c1f47034..aace7b9c 100644 --- a/Frontend/library/webpack.config.js +++ b/Frontend/library/webpack.common.js @@ -5,11 +5,9 @@ const path = require('path'); const webpack = require('webpack'); module.exports = { - mode: 'development', entry: { index: './src/pixelstreamingfrontend.ts' }, - devtool: 'inline-source-map', module: { rules: [ { @@ -28,15 +26,10 @@ module.exports = { }) ], output: { - filename: 'lib-pixelstreamingfrontend.min.js', library: 'lib-pixelstreamingfrontend', // exposed variable that will provide access to the library classes libraryTarget: 'umd', path: path.resolve(__dirname, 'dist'), - clean: false, + clean: true, globalObject: 'this' - }, - optimization: { - minimize: false - }, - stats: 'errors-only' + } }; diff --git a/Frontend/library/webpack.dev.js b/Frontend/library/webpack.dev.js new file mode 100644 index 00000000..80a16541 --- /dev/null +++ b/Frontend/library/webpack.dev.js @@ -0,0 +1,15 @@ +// Copyright Epic Games, Inc. All Rights Reserved. + +const { merge } = require('webpack-merge'); +const common = require('./webpack.common.js'); + +module.exports = merge(common, { + mode: 'development', + devtool: 'inline-source-map', + devServer: { + static: './dist', + }, + output: { + filename: 'lib-pixelstreamingfrontend.js', + } +}); diff --git a/Frontend/library/webpack.prod.js b/Frontend/library/webpack.prod.js new file mode 100644 index 00000000..2bf13537 --- /dev/null +++ b/Frontend/library/webpack.prod.js @@ -0,0 +1,16 @@ +// Copyright Epic Games, Inc. All Rights Reserved. + +const { merge } = require('webpack-merge'); +const common = require('./webpack.common.js'); + +module.exports = merge(common, { + mode: 'production', + optimization: { + usedExports: true, + minimize: true + }, + stats: 'errors-only', + output: { + filename: 'lib-pixelstreamingfrontend.js', + }, +}); diff --git a/RELEASE_VERSION b/RELEASE_VERSION index 8a9ecc2e..6e8bf73a 100644 --- a/RELEASE_VERSION +++ b/RELEASE_VERSION @@ -1 +1 @@ -0.0.1 \ No newline at end of file +0.1.0