初始化

webpack/build.config.utils.ts

@@ -0,0 +1,40 @@
+import * as fs from 'fs';
+import * as path from 'path';
+
+type BuildConfig = Record<string, boolean | string>;
+
+const DEFAULT_CONFIG_PATH = path.resolve(path.dirname(__filename), 'default.build.config.json');
+const configCache: Map<string, BuildConfig> = new Map();
+const mergedCache: Map<string, BuildConfig> = new Map();
+
+export function getConfig(filename: string): BuildConfig {
+    let cached = configCache.get(filename);
+    if (!cached) {
+        const filtered: BuildConfig = {};
+        const absolutePath = path.isAbsolute(filename) ? filename : path.resolve(process.cwd(), filename);
+        const rawConfig = JSON.parse(fs.readFileSync(absolutePath).toString());
+        Object.keys(rawConfig).forEach((key) => {
+            const value = rawConfig[key];
+            if (typeof value === 'boolean' || typeof value === 'string') {
+                filtered[key] = value;
+            }
+        });
+        cached = filtered;
+        configCache.set(filename, cached);
+    }
+    return cached;
+}
+
+export function mergeWithDefaultConfig(custom?: string): BuildConfig {
+    if (!custom) {
+        return getConfig(DEFAULT_CONFIG_PATH);
+    }
+    let cached = mergedCache.get(custom);
+    if (!cached) {
+        const defaultConfig = getConfig(DEFAULT_CONFIG_PATH);
+        const customConfig = getConfig(custom);
+        cached = Object.assign({}, defaultConfig, customConfig);
+        mergedCache.set(custom, cached);
+    }
+    return cached;
+}

webpack/default.build.config.json

@@ -0,0 +1,15 @@
+{
+  "SCRCPY_LISTENS_ON_ALL_INTERFACES": true,
+  "USE_WEBCODECS": true,
+  "USE_BROADWAY": true,
+  "USE_H264_CONVERTER": true,
+  "USE_TINY_H264": true,
+  "USE_WDA_MJPEG_SERVER": false,
+  "USE_QVH_SERVER": true,
+  "INCLUDE_DEV_TOOLS": true,
+  "INCLUDE_ADB_SHELL": true,
+  "INCLUDE_FILE_LISTING": true,
+  "INCLUDE_APPL": false,
+  "INCLUDE_GOOG": true,
+  "PATHNAME": "/"
+}

webpack/ws-scrcpy.common.ts

@@ -0,0 +1,160 @@
+import nodeExternals from 'webpack-node-externals';
+import fs from 'fs';
+import path from 'path';
+import webpack from 'webpack';
+import MiniCssExtractPlugin from 'mini-css-extract-plugin';
+import HtmlWebpackPlugin from 'html-webpack-plugin';
+import GeneratePackageJsonPlugin from '@dead50f7/generate-package-json-webpack-plugin';
+import { mergeWithDefaultConfig } from './build.config.utils';
+
+export const PROJECT_ROOT = path.resolve(__dirname, '..');
+export const SERVER_DIST_PATH = path.join(PROJECT_ROOT, 'dist');
+export const CLIENT_DIST_PATH = path.join(PROJECT_ROOT, 'dist/public');
+const PACKAGE_JSON = path.join(PROJECT_ROOT, 'package.json');
+
+const override = path.join(PROJECT_ROOT, '/build.config.override.json');
+const buildConfigOptions = mergeWithDefaultConfig(override);
+const buildConfigDefinePlugin = new webpack.DefinePlugin({
+    '__PATHNAME__': JSON.stringify(buildConfigOptions.PATHNAME),
+});
+
+export const common = () => {
+    return {
+        module: {
+            rules: [
+                {
+                    test: /\.css$/i,
+                    use: [MiniCssExtractPlugin.loader, 'css-loader'],
+                },
+                {
+                    test: /\.tsx?$/,
+                    use: [
+                        { loader: 'ts-loader' },
+                        {
+                            loader: 'ifdef-loader',
+                            options: buildConfigOptions,
+                        },
+                    ],
+                    exclude: /node_modules/,
+                },
+                {
+                    test: /\.worker\.js$/,
+                    use: { loader: 'worker-loader' },
+                },
+                {
+                    test: /\.svg$/,
+                    loader: 'svg-inline-loader',
+                },
+                {
+                    test: /\.(png|jpe?g|gif)$/i,
+                    use: [
+                        {
+                            loader: 'file-loader',
+                        },
+                    ],
+                },
+                {
+                    test: /\.(asset)$/i,
+                    use: [
+                        {
+                            loader: 'file-loader',
+                            options: {
+                                name: '[name]',
+                            },
+                        },
+                    ],
+                },
+                {
+                    test: /\.jar$/,
+                    use: [
+                        {
+                            loader: 'file-loader',
+                            options: {
+                                name: '[path][name].[ext]',
+                            },
+                        },
+                    ],
+                },
+                {
+                    test: /LICENSE/i,
+                    use: [
+                        {
+                            loader: 'file-loader',
+                            options: {
+                                name: '[path][name]',
+                            },
+                        },
+                    ],
+                },
+            ],
+        },
+        resolve: {
+            extensions: ['.tsx', '.ts', '.js'],
+        },
+    };
+};
+
+const front: webpack.Configuration = {
+    entry: path.join(PROJECT_ROOT, './src/app/index.ts'),
+    externals: ['fs'],
+    plugins: [
+        new HtmlWebpackPlugin({
+            template: path.join(PROJECT_ROOT, '/src/public/index.html'),
+            inject: 'head',
+        }),
+        new MiniCssExtractPlugin(),
+        new webpack.ProvidePlugin({
+            Buffer: ['buffer', 'Buffer'],
+        }),
+    ],
+    resolve: {
+        fallback: {
+            path: 'path-browserify',
+        },
+        extensions: ['.tsx', '.ts', '.js'],
+    },
+    output: {
+        filename: 'bundle.js',
+        path: CLIENT_DIST_PATH,
+    },
+};
+
+export const frontend = () => {
+    return Object.assign({}, common(), front);
+};
+
+const packageJson = JSON.parse(fs.readFileSync(PACKAGE_JSON).toString());
+const { name, version, description, author, license, scripts } = packageJson;
+const basePackage = {
+    name,
+    version,
+    description,
+    author,
+    license,
+    scripts: { start: scripts['script:dist:start'] },
+};
+delete packageJson.dependencies;
+delete packageJson.devDependencies;
+
+const back: webpack.Configuration = {
+    entry: path.join(PROJECT_ROOT, './src/server/index.ts'),
+    externals: [nodeExternals()],
+    plugins: [
+        new GeneratePackageJsonPlugin(basePackage),
+        buildConfigDefinePlugin,
+    ],
+    node: {
+        global: false,
+        __filename: false,
+        __dirname: false,
+    },
+    output: {
+        filename: 'index.js',
+        path: SERVER_DIST_PATH,
+    },
+    target: 'node',
+};
+
+export const backend = () => {
+    return Object.assign({}, common(), back);
+};

webpack/ws-scrcpy.dev.ts

@@ -0,0 +1,16 @@
+import { frontend, backend } from './ws-scrcpy.common';
+import webpack from 'webpack';
+
+const devOpts: webpack.Configuration = {
+    devtool: 'inline-source-map',
+    mode: 'development',
+};
+
+const front = () => {
+    return Object.assign({}, frontend(), devOpts);
+};
+const back = () => {
+    return Object.assign({}, backend(), devOpts);
+};
+
+module.exports = [front, back];

webpack/ws-scrcpy.prod.ts

@@ -0,0 +1,15 @@
+import { backend, frontend } from './ws-scrcpy.common';
+import webpack from 'webpack';
+
+const prodOpts: webpack.Configuration = {
+    mode: 'production',
+};
+
+const front = () => {
+    return Object.assign({}, frontend(), prodOpts);
+};
+const back = () => {
+    return Object.assign({}, backend(), prodOpts);
+};
+
+module.exports = [front, back];