talents-tube/app
9
1
Fork 0
Code Issues Pull Requests Releases Wiki Activity

recorder integration

Browse Source
This commit is contained in:
Thomas Berrod
2019-06-06 16:45:54 +02:00
parent ac90054670
commit 4734b10243
15 changed files with 4186 additions and 815 deletions
Download Patch File Download Diff File Expand all files Collapse all files
nextjs/.babelrc
-3
View File
@@ -1,3 +0,0 @@
{
"presets": ["next/babel"]
}
nextjs/components/organisms/Recorder.js
+119
View File
@@ -0,0 +1,119 @@
import React, { Component } from 'react'
import videojs from 'video.js';
import dynamic from 'next/dynamic'
import Button from '@material-ui/core/Button';
import { withStyles } from '@material-ui/core/styles'
import axios from 'axios'
import CircularProgress from '@material-ui/core/CircularProgress';
import setAuthorizationHeader from "../../data/setAuthorizationHeader";
import 'videojs/dist/video-js.css';
import 'videojs-record/dist/css/videojs.record.css';
dynamic(() => import('webrtc-adapter'), {
ssr: false
})
const RTCRecorder = dynamic(() => import('RecordRTC'), {
ssr: false
})
const styles = theme => ({
root: {
margin: theme.spacing.unit,
maxWidth: '400px', [theme.breakpoints.down('md')]: {
maxWidth: `${100 - (theme.spacing.unit)}vw`
},
button: {
margin: theme.spacing.unit,
alignSelf: 'flex-end'
},
}
})
class Recorder extends Component {
async componentDidMount() {
var record = (await import('videojs-record')).default
// instantiate Video.js
this.player = videojs(this.videoNode, this.props, () => {
// print version information at startup
var version_info = 'Using video.js ' + videojs.VERSION +
' with videojs-record ' + videojs.getPluginVersion('record') +
' and recordrtc ' + RTCRecorder.VERSION;
videojs.log(version_info);
});
// device is ready
this.player.on('deviceReady', () => {
console.log('device is ready!');
});
// user clicked the record button and started recording
this.player.on('startRecord', () => {
console.log('started recording!');
});
// user completed recording and stream is available
this.player.on('finishRecord', () => {
// recordedData is a blob object containing the recorded data that
// can be downloaded by the user, stored on server etc.
console.log('finished recording: ', this.player.recordedData);
});
// error handling
this.player.on('error', (element, error) => {
console.warn(error);
});
this.player.on('deviceError', () => {
console.error('device error:', this.player.deviceErrorCode);
});
}
// destroy player on unmount
componentWillUnmount() {
if (this.player) {
this.player.dispose();
}
}
sendBlob = () => {
console.log('accessing recording: ', this.player.recordedData)
var formData = new FormData();
formData.append('upload', this.player.recordedData, "myupload");
// formData.append('user', 7);//TODO: taking from auth
setAuthorizationHeader('eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJpYXQiOjE1NTk3Mzk1MjUsImV4cCI6MTU1OTc0MzEyNSwicm9sZXMiOlsiUk9MRV9UQUxFTlQiLCJST0xFX1VTRVIiXSwidXNlcm5hbWUiOiJ0aG9tYXMuYmVycm9kQGUtZGVjbGljLmNvbSJ9.iW5DwfZuF3Qpa4exqI5Q8t_kv22ZUA7pvs4sFc-Qgl6qRH516thDKg-h7b0A1590xM8wI4WnEXJgOu5IT64UCeVtJpXaa9AzwhSFjVAv0SwkVt73NoJ45NiyxQsx_41Xjk1NAGVOIHvGgcMOEiZj4n1qXJeskjRmU-yprZ8Atg9ce1P4BEsAth99DN0KMtEjrP3VW8SFh9kOOGB9IGLTq5FRRvdONStW0MRRtS3KSwFzOZsMRqStW8ncI1EaRt76ulEKkx-Ka4WkdTc--DR9v5N36negmCgh54U0YPZ9B9lsJXDTsHdDkqC4f6nY0Wm-TNKKK1E5fPL86lkkHkure8JgLKKbATaEk5CDdRJAQED1T_cDId4OgnCGrzSEUbpCg0hx1V8EY4Y2l_AQOFfTxfBobTJ5Yf4zdtVok84ww5QV3GQG9bfmbEWyR1RxegC6s0am9SSLSsuZ-UDSmv336sSIh38ldzivUdnN7YHD0_QihDgLOPtZEsiEjsmbFBgX3fwSsGI0cs7UtCSiwsFLjDm6vxIQU9GK54pa82x-3N-7njDF0BgRE4gUoLDfREZdApaWXGpvHAoQQd9Y1vsWDQxE3JQQKRGkqWex7YYo-98Jweax2DzJeeAvFQeGEzE_O4m1rVG832Z0IAkt8wYRnsGFMlCjLysHoL0xTFNWUqE')
axios.post("http://localhost/app_dev.php/api/media",
formData,
{
headers: {
'Content-Type': `multipart/form-data;`
},
withCredentials: true
})
.then(res => console.log(res)).catch(err => console.log(err))
console.log('end send Blob')
}
render() {
const { classes } = this.props;
return (
<div>
<div data-vjs-player>
<video id="myVideo" ref={node => this.videoNode = node} className="video-js vjs-default-skin" playsInline></video>
</div>
<div>
<Button type="submit" variant="outlined" color="secondary"
className={classes.button}
onClick={this.sendBlob}>
Send
</Button>
</div>
</div>
);
}
}
export default withStyles(styles)(Recorder)
nextjs/next.config.js
+57 -5
View File
@@ -2,18 +2,70 @@
const withPlugins = require('next-compose-plugins');
const optimizedImages = require('next-optimized-images');
const webpack = require("webpack");
const withCSS = require('@ostai/next-css');
const { ANALYZE, DEV } = process.env
module.exports = withPlugins([
[withCSS],
[optimizedImages, {
/* config for next-optimized-images */
}],
[{
publicRuntimeConfig:{
adListDefaultUrl : "https://www.talentstube.com/img/default_picture_company.svg",
[{
publicRuntimeConfig: {
adListDefaultUrl: "https://www.talentstube.com/img/default_picture_company.svg",
logoRootUrl: 'https://www.talentstube.com/media/cache/profile_thumb/uploads/img/'
}
}]
}]],
{
webpack: (config, { isServer }) => {
]);
if (ANALYZE) {
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
config.plugins.push(new BundleAnalyzerPlugin({
analyzerMode: 'server',
analyzerPort: isServer ? 8888 : 8889,
openAnalyzer: true
}))
}
const videojsPlugin = new webpack.ProvidePlugin({
videojs: "video.js/dist/video.cjs.js",
RecordRTC: "recordrtc",
MediaStreamRecorder: ["recordrtc", "MediaStreamRecorder"]
});
const videojsAlias = {
videojs: "video.js",
WaveSurfer: "wavesurfer.js",
RecordRTC: "recordrtc"
};
config.resolve.alias = { ...config.resolve.alias, ...videojsAlias };
config.plugins.push(videojsPlugin);
// config.module.rules.push(
// {
// test: /\.css$/,
// loader: 'style-loader!css-loader',
// include: [/node_modules/]
// },
// )
console.log(config);
return config
}
},
{
generateBuildId: async () => {
// For example get the latest git commit hash here
return 'v0.1.0'
}
},
);
nextjs/package.json
+11 -2
View File
@@ -6,8 +6,10 @@
"terser": "3.14.1"
},
"dependencies": {
"@blunck/next-alias": "^1.0.0",
"@material-ui/core": "^4.0.0",
"@material-ui/icons": "^3.0.1",
"@ostai/next-css": "^1.0.2",
"axios": "^0.18.0",
"connect-mongo": "^2.0.1",
"cross-env": "^5.2.0",
@@ -25,6 +27,7 @@
"next-optimized-images": "^1.4.1",
"next-redux-saga": "^4.0.2",
"next-redux-wrapper": "^3.0.0-alpha.2",
"next-transpile-modules": "^2.3.1",
"nodemailer": "^4.6.8",
"nodemailer-direct-transport": "^3.3.2",
"nodemailer-smtp-transport": "^2.7.4",
@@ -37,20 +40,26 @@
"react-plyr": "^2.1.1",
"react-redux": "^7.0.3",
"reactstrap": "^6.4.0",
"recordrtc": "^5.5.4",
"redux": "^4.0.1",
"redux-devtools-extension": "^2.13.8",
"redux-saga": "^1.0.2",
"reselect": "^4.0.0",
"style-loader": "^0.23.1",
"terser": "3.14",
"universal-cookie": "^3.0.4",
"validator": "^11.0.0",
"video.js": "^7.2.2",
"videojs-record": "^3.6.0"
"video.js": "latest",
"videojs-record": "latest",
"webrtc-adapter": "^7.2.3"
},
"scripts": {
"dev": "node server.js",
"build": "next build",
"start": "cross-env NODE_ENV=production node server.js"
},
"devDependencies": {
"webpack-bundle-analyzer": "^3.0.3"
},
"eslint.packageManager": "yarn"
}
nextjs/pages/Login.js
-11
View File
@@ -28,7 +28,6 @@ const styles = theme => ({
});
<<<<<<< HEAD
class LoginPage extends React.Component {
state = {
data: {
@@ -68,10 +67,6 @@ class LoginPage extends React.Component {
if (!data.password) errors.password = "Can't be blank";
return errors;
};
=======
class Login extends React.Component {
>>>>>>> master
render() {
const { classes } = this.props;
@@ -91,15 +86,12 @@ class Login extends React.Component {
label="Email"
margin="normal"
type="email"
<<<<<<< HEAD
value={data.email}
onChange={this.onChange}
autoComplete="username"
=======
required
error={email === ""}
helperText={email === "" ? 'Ce champ est vide!' : ' '}
>>>>>>> master
/>
<TextField
@@ -109,15 +101,12 @@ class Login extends React.Component {
label="Mot de passe"
margin="normal"
type="password"
<<<<<<< HEAD
value={data.password}
onChange={this.onChange}
autoComplete="current-password"
=======
error={password === ""}
helperText={password === "" ? 'Ce champ est vide!' : ' '}
required
>>>>>>> master
/>
<Button type="submit" variant="outlined" color="primary">
nextjs/pages/Reponse.js
+71
View File
@@ -0,0 +1,71 @@
import React from 'react'
import Recorder from '../Components/organisms/Recorder'
import Layout from '../components/templates/LayoutDetail'
import { withStyles } from '@material-ui/core/styles'
import Head from 'next/head'
import _ from 'lodash'
const styles = theme => ({
root: {
margin: theme.spacing.unit,
height: 250,
width: 400
},
});
const videoJsOptions = {
controls: true,
// width: 800,
// height: 600,
fluid: true,
plugins: {
/*
// wavesurfer section is only needed when recording audio-only
wavesurfer: {
src: 'live',
waveColor: '#36393b',
progressColor: 'black',
debug: true,
cursorWidth: 1,
msDisplayMax: 20,
hideScrollbar: true
},
*/
record: {
audio: true,
video: true,
// maxLength: 10,
debug: true
}
}
};
class Reponse extends React.Component {
state = {
};
componentDidMount() {
}
render() {
const { classes, menu} = this.props;
return (
<Layout menu={menu}>
<Head>
<title>Record</title>
<meta name="description" content="Web rtc for PWA" />
<link rel="canonical" href="https://pwa-boiler.bzh" />
</Head>
<div className={classes.root}>
<Recorder {...videoJsOptions} />
</div>
</Layout>
)
}
}
export default withStyles(styles)(Reponse)
nextjs/pages/auth/error.js
-1
View File
@@ -2,7 +2,6 @@ import React from 'react'
import Link from 'next/link'
import Page from '../../components/templates/page'
import Layout from '../../components/templates/layoutAuth'
export default class extends Page {
static async getInitialProps({req, query}) {
nextjs/webpackCompile.out
+126
View File
@@ -0,0 +1,126 @@
{ mode: 'production',
devtool: false,
name: 'client',
target: 'web',
externals: undefined,
optimization:
{ checkWasmTypes: false,
nodeEnv: false,
runtimeChunk: { name: 'static/runtime/webpack.js' },
splitChunks: { chunks: 'all', cacheGroups: [Object] },
minimize: true,
minimizer: [ [TerserPlugin] ] },
recordsPath:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\.next\\records.json',
context: 'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs',
entry: [AsyncFunction: entry],
output:
{ path:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\.next',
filename: [Function: filename],
libraryTarget: 'var',
hotUpdateChunkFilename: 'static/webpack/[id].[hash].hot-update.js',
hotUpdateMainFilename: 'static/webpack/[hash].hot-update.json',
chunkFilename: 'static/chunks/[name].[contenthash].js',
strictModuleExceptionHandling: true,
crossOriginLoading: undefined,
futureEmitAssets: true,
webassemblyModuleFilename: 'static/wasm/[modulehash].wasm' },
performance: false,
resolve:
{ extensions: [ '.mjs', '.js', '.jsx', '.json', '.wasm' ],
modules: [ 'node_modules' ],
alias:
{ 'next/head': 'next-server/dist/lib/head.js',
'next/router': 'next/dist/client/router.js',
'next/config': 'next-server/dist/lib/runtime-config.js',
'next/dynamic': 'next-server/dist/lib/dynamic.js',
next:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\node_modules\\next',
'private-next-pages':
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\pages',
'private-dot-next':
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\.next',
videojs: 'video.js',
WaveSurfer: 'wavesurfer.js',
RecordRTC: 'recordrtc' },
mainFields: [ 'browser', 'module', 'main' ] },
resolveLoader:
{ modules:
[ 'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\node_modules\\next\\dist\\build\\webpack\\loaders',
'node_modules' ] },
module: { rules: [ [Object] ] },
plugins:
[ ChunkNamesPlugin {},
DefinePlugin { definitions: [Object] },
ReactLoadablePlugin { filename: 'react-loadable-manifest.json' },
HashedModuleIdsPlugin { options: [Object] },
HashedChunkIdsPlugin { buildId: 'v0.1.0' },
IgnorePlugin {
options: [Object],
checkIgnore: [Function: bound checkIgnore] },
BuildManifestPlugin {},
ProvidePlugin { definitions: [Object] } ] }
{ mode: 'production',
devtool: false,
name: 'server',
target: 'node',
externals: [ [Function] ],
optimization:
{ checkWasmTypes: false,
nodeEnv: false,
splitChunks: false,
minimize: false },
recordsPath:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\.next\\server\\records.json',
context: 'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs',
entry: [AsyncFunction: entry],
output:
{ path:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\.next\\server',
filename: [Function: filename],
libraryTarget: 'commonjs2',
hotUpdateChunkFilename: 'static/webpack/[id].[hash].hot-update.js',
hotUpdateMainFilename: 'static/webpack/[hash].hot-update.json',
chunkFilename: '[name].[contenthash].js',
strictModuleExceptionHandling: true,
crossOriginLoading: undefined,
futureEmitAssets: true,
webassemblyModuleFilename: 'static/wasm/[modulehash].wasm' },
performance: false,
resolve:
{ extensions: [ '.js', '.mjs', '.jsx', '.json', '.wasm' ],
modules: [ 'node_modules' ],
alias:
{ 'next/head': 'next-server/dist/lib/head.js',
'next/router': 'next/dist/client/router.js',
'next/config': 'next-server/dist/lib/runtime-config.js',
'next/dynamic': 'next-server/dist/lib/dynamic.js',
next:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\node_modules\\next',
'private-next-pages':
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\pages',
'private-dot-next':
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\.next',
videojs: 'video.js',
WaveSurfer: 'wavesurfer.js',
RecordRTC: 'recordrtc' },
mainFields: [ 'main', 'module' ] },
resolveLoader:
{ modules:
[ 'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\nextjs\\node_modules\\next\\dist\\build\\webpack\\loaders',
'node_modules' ] },
module: { rules: [ [Object] ] },
plugins:
[ ChunkNamesPlugin {},
DefinePlugin { definitions: [Object] },
HashedModuleIdsPlugin { options: [Object] },
HashedChunkIdsPlugin { buildId: 'v0.1.0' },
IgnorePlugin {
options: [Object],
checkIgnore: [Function: bound checkIgnore] },
PagesManifestPlugin {},
NextJsSsrImportPlugin { options: [Object] },
NextJsSsrImportPlugin {},
ProvidePlugin { definitions: [Object] } ] }
nextjs/yarn-error.log
+2719 -764
View File
File diff suppressed because it is too large Load Diff
nextjs/yarn.lock
+941 -19
View File
File diff suppressed because it is too large Load Diff
webRTC/components/Recorder.js
+2 -1
View File
@@ -18,6 +18,7 @@ const RTCRecorder = dynamic(() => import('RecordRTC'), {
ssr: false
})
//import Record from 'videojs-record/dist/videojs.record';
// const record = dynamic(() => import('videojs-record/dist/videojs.record'), {
// ssr: false
@@ -39,7 +40,7 @@ const styles = theme => ({
class Recorder extends Component {
async componentDidMount() {
var record = (await import('videojs-record/dist/videojs.record')).default
var record = (await import('videojs-record/dist/videojs.record.js')).default
// instantiate Video.js
this.player = videojs(this.videoNode, this.props, () => {
// print version information at startup
webRTC/next.config.js
+7 -7
View File
@@ -119,14 +119,14 @@ module.exports = withPlugins(
config.resolve.alias = { ...config.resolve.alias, ...videojsAlias };
config.plugins.push(videojsPlugin);
// config.module.rules.push(
// {
// test: /\.css$/,
// loader: 'style-loader!css-loader',
// // include: [/node_modules/]
// },
config.module.rules.push(
{
test: /\.css$/,
loader: 'style-loader!css-loader',
// include: [/node_modules/]
},
// )
)
console.log(config);
return config
webRTC/package.json
+1 -1
View File
@@ -1,5 +1,5 @@
{
"name": "WP-next",
"name": "WebRTC",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
webRTC/webpackconmpile.out
+131
View File
@@ -0,0 +1,131 @@
{ mode: 'production',
devtool: false,
name: 'client',
target: 'web',
externals: undefined,
optimization:
{ checkWasmTypes: false,
nodeEnv: false,
runtimeChunk: { name: 'static/runtime/webpack.js' },
splitChunks: { chunks: 'all', cacheGroups: [Object] },
minimize: true,
minimizer: [ [TerserPlugin], [OptimizeCssAssetsWebpackPlugin] ] },
recordsPath:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\.next\\records.json',
context: 'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC',
entry: [AsyncFunction],
output:
{ path:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\.next',
filename: [Function: filename],
libraryTarget: 'var',
hotUpdateChunkFilename: 'static/webpack/[id].[hash].hot-update.js',
hotUpdateMainFilename: 'static/webpack/[hash].hot-update.json',
chunkFilename: 'static/chunks/[name].[contenthash].js',
strictModuleExceptionHandling: true,
crossOriginLoading: undefined,
futureEmitAssets: true,
webassemblyModuleFilename: 'static/wasm/[modulehash].wasm' },
performance: false,
resolve:
{ extensions: [ '.mjs', '.js', '.jsx', '.json', '.wasm' ],
modules: [ 'node_modules' ],
alias:
{ 'next/head': 'next-server/dist/lib/head.js',
'next/router': 'next/dist/client/router.js',
'next/config': 'next-server/dist/lib/runtime-config.js',
'next/dynamic': 'next-server/dist/lib/dynamic.js',
next:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\node_modules\\next',
'private-next-pages':
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\pages',
'private-dot-next':
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\.next',
videojs: 'video.js',
WaveSurfer: 'wavesurfer.js',
RecordRTC: 'recordrtc' },
mainFields: [ 'browser', 'module', 'main' ] },
resolveLoader:
{ modules:
[ 'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\node_modules\\next\\dist\\build\\webpack\\loaders',
'node_modules' ] },
module: { rules: [ [Object], [Object], [Object], [Object] ] },
plugins:
[ ChunkNamesPlugin {},
DefinePlugin { definitions: [Object] },
ReactLoadablePlugin { filename: 'react-loadable-manifest.json' },
HashedModuleIdsPlugin { options: [Object] },
HashedChunkIdsPlugin { buildId: 'Lwfz6_sDFLDqGBevR3SqW' },
IgnorePlugin {
options: [Object],
checkIgnore: [Function: bound checkIgnore] },
BuildManifestPlugin {},
CleanWebpackPlugin { paths: [Array], options: [Object] },
GenerateSW { config: [Object] },
InlineNextPrecacheManifestPlugin { opts: [Object] },
ExtractCssChunksPlugin { options: [Object] },
ProvidePlugin { definitions: [Object] } ] }
{ mode: 'production',
devtool: false,
name: 'server',
target: 'node',
externals: [ [Function] ],
optimization:
{ checkWasmTypes: false,
nodeEnv: false,
splitChunks: false,
minimize: false,
minimizer: [ [OptimizeCssAssetsWebpackPlugin] ] },
recordsPath:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\.next\\server\\records.json',
context: 'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC',
entry: [AsyncFunction],
output:
{ path:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\.next\\server',
filename: [Function: filename],
libraryTarget: 'commonjs2',
hotUpdateChunkFilename: 'static/webpack/[id].[hash].hot-update.js',
hotUpdateMainFilename: 'static/webpack/[hash].hot-update.json',
chunkFilename: '[name].[contenthash].js',
strictModuleExceptionHandling: true,
crossOriginLoading: undefined,
futureEmitAssets: true,
webassemblyModuleFilename: 'static/wasm/[modulehash].wasm' },
performance: false,
resolve:
{ extensions: [ '.js', '.mjs', '.jsx', '.json', '.wasm' ],
modules: [ 'node_modules' ],
alias:
{ 'next/head': 'next-server/dist/lib/head.js',
'next/router': 'next/dist/client/router.js',
'next/config': 'next-server/dist/lib/runtime-config.js',
'next/dynamic': 'next-server/dist/lib/dynamic.js',
next:
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\node_modules\\next',
'private-next-pages':
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\pages',
'private-dot-next':
'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\.next',
videojs: 'video.js',
WaveSurfer: 'wavesurfer.js',
RecordRTC: 'recordrtc' },
mainFields: [ 'main', 'module' ] },
resolveLoader:
{ modules:
[ 'C:\\Users\\Thomas\\Documents\\_Projects\\TTapp\\webRTC\\node_modules\\next\\dist\\build\\webpack\\loaders',
'node_modules' ] },
module: { rules: [ [Object], [Object], [Object], [Object] ] },
plugins:
[ ChunkNamesPlugin {},
DefinePlugin { definitions: [Object] },
HashedModuleIdsPlugin { options: [Object] },
HashedChunkIdsPlugin { buildId: 'Lwfz6_sDFLDqGBevR3SqW' },
IgnorePlugin {
options: [Object],
checkIgnore: [Function: bound checkIgnore] },
PagesManifestPlugin {},
NextJsSsrImportPlugin { options: [Object] },
NextJsSsrImportPlugin {},
ProvidePlugin { definitions: [Object] } ] }