mirror of
https://gitcode.com/GitHub_Trending/ji/jitsi-meet.git
synced 2025-12-30 11:22:31 +00:00
9dd44fc48e
It's about to become very confusing, since we are going to add actual local recordings with video. This feature was never fully finalizeed since it required manual processing of the files, as they were not uploaded anywhere. In addition, unless one opens the local audio device without any audio processing first, any tracks opened later will have audio proceessing turned on, something not desirable for the scenario this feature was designed for in the first place: podcasts. This feature will likely come back as a JaaS demo / MVP where the local recording is made outside of the Jitsi Meet iframe.
397 lines
14 KiB
JavaScript
397 lines
14 KiB
JavaScript
/* global __dirname */
|
|
|
|
const CircularDependencyPlugin = require('circular-dependency-plugin');
|
|
const fs = require('fs');
|
|
const { join } = require('path');
|
|
const process = require('process');
|
|
const webpack = require('webpack');
|
|
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
|
|
|
|
/**
|
|
* The URL of the Jitsi Meet deployment to be proxy to in the context of
|
|
* development with webpack-dev-server.
|
|
*/
|
|
const devServerProxyTarget
|
|
= process.env.WEBPACK_DEV_SERVER_PROXY_TARGET || 'https://alpha.jitsi.net';
|
|
|
|
/**
|
|
* Build a Performance configuration object for the given size.
|
|
* See: https://webpack.js.org/configuration/performance/
|
|
*
|
|
* @param {Object} options - options for the bundles configuration.
|
|
* @param {boolean} options.analyzeBundle - whether the bundle needs to be analyzed for size.
|
|
* @param {boolean} options.minimize - whether the code should be minimized or not.
|
|
* @param {number} size - the size limit to apply.
|
|
* @returns {Object} a performance hints object.
|
|
*/
|
|
function getPerformanceHints(options, size) {
|
|
const { analyzeBundle, minimize } = options;
|
|
|
|
return {
|
|
hints: minimize && !analyzeBundle ? 'error' : false,
|
|
maxAssetSize: size,
|
|
maxEntrypointSize: size
|
|
};
|
|
}
|
|
|
|
/**
|
|
* Build a BundleAnalyzerPlugin plugin instance for the given bundle name.
|
|
*
|
|
* @param {boolean} analyzeBundle - whether the bundle needs to be analyzed for size.
|
|
* @param {string} name - the name of the bundle.
|
|
* @returns {Array} a configured list of plugins.
|
|
*/
|
|
function getBundleAnalyzerPlugin(analyzeBundle, name) {
|
|
if (!analyzeBundle) {
|
|
return [];
|
|
}
|
|
|
|
return [ new BundleAnalyzerPlugin({
|
|
analyzerMode: 'disabled',
|
|
generateStatsFile: true,
|
|
statsFilename: `${name}-stats.json`
|
|
}) ];
|
|
}
|
|
|
|
/**
|
|
* Determines whether a specific (HTTP) request is to bypass the proxy of
|
|
* webpack-dev-server (i.e. is to be handled by the proxy target) and, if not,
|
|
* which local file is to be served in response to the request.
|
|
*
|
|
* @param {Object} request - The (HTTP) request received by the proxy.
|
|
* @returns {string|undefined} If the request is to be served by the proxy
|
|
* target, undefined; otherwise, the path to the local file to be served.
|
|
*/
|
|
function devServerProxyBypass({ path }) {
|
|
if (path.startsWith('/css/')
|
|
|| path.startsWith('/doc/')
|
|
|| path.startsWith('/fonts/')
|
|
|| path.startsWith('/images/')
|
|
|| path.startsWith('/lang/')
|
|
|| path.startsWith('/sounds/')
|
|
|| path.startsWith('/static/')
|
|
|| path.endsWith('.wasm')) {
|
|
|
|
return path;
|
|
}
|
|
|
|
if (path.startsWith('/libs/')) {
|
|
if (path.endsWith('.min.js') && !fs.existsSync(join(process.cwd(), path))) {
|
|
return path.replace('.min.js', '.js');
|
|
}
|
|
|
|
return path;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* The base Webpack configuration to bundle the JavaScript artifacts of
|
|
* jitsi-meet such as app.bundle.js and external_api.js.
|
|
*
|
|
* @param {Object} options - options for the bundles configuration.
|
|
* @param {boolean} options.detectCircularDeps - whether to detect circular dependencies or not.
|
|
* @param {boolean} options.minimize - whether the code should be minimized or not.
|
|
* @returns {Object} the base config object.
|
|
*/
|
|
function getConfig(options = {}) {
|
|
const { detectCircularDeps, minimize } = options;
|
|
|
|
return {
|
|
devtool: 'source-map',
|
|
mode: minimize ? 'production' : 'development',
|
|
module: {
|
|
rules: [ {
|
|
// Transpile ES2015 (aka ES6) to ES5. Accept the JSX syntax by React
|
|
// as well.
|
|
|
|
loader: 'babel-loader',
|
|
options: {
|
|
// Avoid loading babel.config.js, since we only use it for React Native.
|
|
configFile: false,
|
|
|
|
// XXX The require.resolve bellow solves failures to locate the
|
|
// presets when lib-jitsi-meet, for example, is npm linked in
|
|
// jitsi-meet.
|
|
plugins: [
|
|
require.resolve('@babel/plugin-proposal-export-default-from')
|
|
],
|
|
presets: [
|
|
[
|
|
require.resolve('@babel/preset-env'),
|
|
|
|
// Tell babel to avoid compiling imports into CommonJS
|
|
// so that webpack may do tree shaking.
|
|
{
|
|
modules: false,
|
|
|
|
// Specify our target browsers so no transpiling is
|
|
// done unnecessarily. For browsers not specified
|
|
// here, the ES2015+ profile will be used.
|
|
targets: {
|
|
chrome: 80,
|
|
electron: 10,
|
|
firefox: 68,
|
|
safari: 14
|
|
}
|
|
|
|
}
|
|
],
|
|
require.resolve('@babel/preset-flow'),
|
|
require.resolve('@babel/preset-react')
|
|
]
|
|
},
|
|
test: /\.jsx?$/
|
|
}, {
|
|
// TODO: get rid of this.
|
|
// Expose jquery as the globals $ and jQuery because it is expected
|
|
// to be available in such a form by lib-jitsi-meet.
|
|
loader: 'expose-loader',
|
|
options: {
|
|
exposes: [ '$', 'jQuery' ]
|
|
},
|
|
test: require.resolve('jquery')
|
|
}, {
|
|
// Allow CSS to be imported into JavaScript.
|
|
|
|
test: /\.css$/,
|
|
use: [
|
|
'style-loader',
|
|
'css-loader'
|
|
]
|
|
}, {
|
|
test: /\/node_modules\/@atlaskit\/modal-dialog\/.*\.js$/,
|
|
resolve: {
|
|
alias: {
|
|
'react-focus-lock': `${__dirname}/react/features/base/util/react-focus-lock-wrapper.js`,
|
|
'../styled/Modal': `${__dirname}/react/features/base/dialog/components/web/ThemedDialog.js`
|
|
}
|
|
}
|
|
}, {
|
|
test: /\/react\/features\/base\/util\/react-focus-lock-wrapper.js$/,
|
|
resolve: {
|
|
alias: {
|
|
'react-focus-lock': `${__dirname}/node_modules/react-focus-lock`
|
|
}
|
|
}
|
|
}, {
|
|
test: /\.svg$/,
|
|
use: [ {
|
|
loader: '@svgr/webpack',
|
|
options: {
|
|
dimensions: false,
|
|
expandProps: 'start'
|
|
}
|
|
} ]
|
|
}, {
|
|
test: /\.tsx?$/,
|
|
exclude: /node_modules/,
|
|
loader: 'ts-loader'
|
|
} ]
|
|
},
|
|
node: {
|
|
// Allow the use of the real filename of the module being executed. By
|
|
// default Webpack does not leak path-related information and provides a
|
|
// value that is a mock (/index.js).
|
|
__filename: true
|
|
},
|
|
optimization: {
|
|
concatenateModules: minimize,
|
|
minimize
|
|
},
|
|
output: {
|
|
filename: `[name]${minimize ? '.min' : ''}.js`,
|
|
path: `${__dirname}/build`,
|
|
publicPath: '/libs/',
|
|
sourceMapFilename: '[file].map'
|
|
},
|
|
plugins: [
|
|
detectCircularDeps
|
|
&& new CircularDependencyPlugin({
|
|
allowAsyncCycles: false,
|
|
exclude: /node_modules/,
|
|
failOnError: false
|
|
})
|
|
].filter(Boolean),
|
|
resolve: {
|
|
alias: {
|
|
'focus-visible': 'focus-visible/dist/focus-visible.min.js'
|
|
},
|
|
aliasFields: [
|
|
'browser'
|
|
],
|
|
extensions: [
|
|
'.web.js',
|
|
|
|
// Typescript:
|
|
'.tsx',
|
|
'.ts',
|
|
|
|
// Webpack defaults:
|
|
'.js',
|
|
'.json'
|
|
],
|
|
fallback: {
|
|
// Provide some empty Node modules (required by AtlasKit, olm).
|
|
crypto: false,
|
|
fs: false,
|
|
path: false,
|
|
process: false
|
|
}
|
|
}
|
|
};
|
|
}
|
|
|
|
/**
|
|
* Helper function to build the dev server config. It's necessary to split it in
|
|
* Webpack 5 because only one devServer entry is supported, so we attach it to
|
|
* the main bundle.
|
|
*
|
|
|
|
* @returns {Object} the dev server configuration.
|
|
*/
|
|
function getDevServerConfig() {
|
|
return {
|
|
client: {
|
|
overlay: {
|
|
errors: true,
|
|
warnings: false
|
|
}
|
|
},
|
|
host: '127.0.0.1',
|
|
hot: true,
|
|
proxy: {
|
|
'/': {
|
|
bypass: devServerProxyBypass,
|
|
secure: false,
|
|
target: devServerProxyTarget,
|
|
headers: {
|
|
'Host': new URL(devServerProxyTarget).host
|
|
}
|
|
}
|
|
},
|
|
server: 'https',
|
|
static: {
|
|
directory: process.cwd()
|
|
}
|
|
};
|
|
}
|
|
|
|
module.exports = (_env, argv) => {
|
|
const analyzeBundle = Boolean(process.env.ANALYZE_BUNDLE);
|
|
const mode = typeof argv.mode === 'undefined' ? 'production' : argv.mode;
|
|
const isProduction = mode === 'production';
|
|
const configOptions = {
|
|
detectCircularDeps: Boolean(process.env.DETECT_CIRCULAR_DEPS) || !isProduction,
|
|
minimize: isProduction
|
|
};
|
|
const config = getConfig(configOptions);
|
|
const perfHintOptions = {
|
|
analyzeBundle,
|
|
minimize: isProduction
|
|
};
|
|
|
|
return [
|
|
Object.assign({}, config, {
|
|
entry: {
|
|
'app.bundle': './app.js'
|
|
},
|
|
devServer: isProduction ? {} : getDevServerConfig(),
|
|
plugins: [
|
|
...config.plugins,
|
|
...getBundleAnalyzerPlugin(analyzeBundle, 'app'),
|
|
new webpack.IgnorePlugin({
|
|
resourceRegExp: /^canvas$/,
|
|
contextRegExp: /resemblejs$/
|
|
}),
|
|
new webpack.IgnorePlugin({
|
|
resourceRegExp: /^\.\/locale$/,
|
|
contextRegExp: /moment$/
|
|
}),
|
|
new webpack.ProvidePlugin({
|
|
process: 'process/browser'
|
|
})
|
|
],
|
|
performance: getPerformanceHints(perfHintOptions, 4 * 1024 * 1024)
|
|
}),
|
|
Object.assign({}, config, {
|
|
entry: {
|
|
'alwaysontop': './react/features/always-on-top/index.js'
|
|
},
|
|
plugins: [
|
|
...config.plugins,
|
|
...getBundleAnalyzerPlugin(analyzeBundle, 'alwaysontop')
|
|
],
|
|
performance: getPerformanceHints(perfHintOptions, 800 * 1024)
|
|
}),
|
|
Object.assign({}, config, {
|
|
entry: {
|
|
'dial_in_info_bundle': './react/features/invite/components/dial-in-info-page'
|
|
},
|
|
plugins: [
|
|
...config.plugins,
|
|
...getBundleAnalyzerPlugin(analyzeBundle, 'dial_in_info'),
|
|
new webpack.IgnorePlugin({
|
|
resourceRegExp: /^\.\/locale$/,
|
|
contextRegExp: /moment$/
|
|
})
|
|
],
|
|
performance: getPerformanceHints(perfHintOptions, 500 * 1024)
|
|
}),
|
|
Object.assign({}, config, {
|
|
entry: {
|
|
'do_external_connect': './connection_optimization/do_external_connect.js'
|
|
},
|
|
plugins: [
|
|
...config.plugins,
|
|
...getBundleAnalyzerPlugin(analyzeBundle, 'do_external_connect')
|
|
],
|
|
performance: getPerformanceHints(perfHintOptions, 5 * 1024)
|
|
}),
|
|
Object.assign({}, config, {
|
|
entry: {
|
|
'analytics-ga': './react/features/analytics/handlers/GoogleAnalyticsHandler.js'
|
|
},
|
|
plugins: [
|
|
...config.plugins,
|
|
...getBundleAnalyzerPlugin(analyzeBundle, 'analytics-ga')
|
|
],
|
|
performance: getPerformanceHints(perfHintOptions, 5 * 1024)
|
|
}),
|
|
Object.assign({}, config, {
|
|
entry: {
|
|
'close3': './static/close3.js'
|
|
},
|
|
plugins: [
|
|
...config.plugins,
|
|
...getBundleAnalyzerPlugin(analyzeBundle, 'close3')
|
|
],
|
|
performance: getPerformanceHints(perfHintOptions, 128 * 1024)
|
|
}),
|
|
|
|
Object.assign({}, config, {
|
|
entry: {
|
|
'external_api': './modules/API/external/index.js'
|
|
},
|
|
output: Object.assign({}, config.output, {
|
|
library: 'JitsiMeetExternalAPI',
|
|
libraryTarget: 'umd'
|
|
}),
|
|
plugins: [
|
|
...config.plugins,
|
|
...getBundleAnalyzerPlugin(analyzeBundle, 'external_api')
|
|
],
|
|
performance: getPerformanceHints(perfHintOptions, 35 * 1024)
|
|
}),
|
|
Object.assign({}, config, {
|
|
entry: {
|
|
'face-landmarks-worker': './react/features/face-landmarks/faceLandmarksWorker.js'
|
|
},
|
|
plugins: [
|
|
...config.plugins,
|
|
...getBundleAnalyzerPlugin(analyzeBundle, 'face-landmarks-worker')
|
|
],
|
|
performance: getPerformanceHints(perfHintOptions, 1024 * 1024 * 1.5)
|
|
})
|
|
];
|
|
};
|