darwinva97
commented
3 years ago Me too with Gatsby. The error doesn't appear in development time, only when i run compilation. node: v16.3.0 npm: 7.18.1 yarn: 1.22.10
package.json:
{
"name": "darwin-va",
"version": "1.0.0",
"private": true,
"description": "DarwinVA",
"author": "Darwin Vilcachagua Ayala",
"keywords": [
"gatsby"
],
"scripts": {
"develop": "gatsby develop -p 3033",
"start": "gatsby develop -p 3033",
"build": "gatsby build",
"serve": "gatsby serve",
"clean": "gatsby clean"
},
"dependencies": {
"@mdx-js/mdx": "^1.6.22",
"@mdx-js/react": "^1.6.22",
"flv.js": "^1.5.0",
"gatsby": "^3.3.1",
"gatsby-plugin-gatsby-cloud": "^2.4.0",
"gatsby-plugin-google-analytics": "^3.4.0",
"gatsby-plugin-image": "^1.4.0",
"gatsby-plugin-layout": "^2.4.0",
"gatsby-plugin-manifest": "^3.4.0",
"gatsby-plugin-mdx": "^2.4.0",
"gatsby-plugin-offline": "^4.4.0",
"gatsby-plugin-react-helmet": "^4.4.0",
"gatsby-plugin-sharp": "^3.4.0",
"gatsby-plugin-sitemap": "^4.0.0",
"gatsby-remark-images": "^5.1.0",
"gatsby-source-filesystem": "^3.4.0",
"gatsby-transformer-remark": "^4.1.0",
"gatsby-transformer-sharp": "^3.4.0",
"mpegts.js": "^1.6.7",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-helmet": "^6.1.0",
"react-icons": "^4.2.0",
"react-responsive-masonry": "^2.1.2",
"socket.io-client": "^4.0.2"
},
"main": "index.js",
"license": "MIT"
}Code:
const Video = () => {
const videoRef = useRef(null)
useEffect(() => {
if(videoRef && videoRef.current) {
const video = videoRef.current
var player = mpegts.createPlayer({
type: 'flv',
isLive: true,
url: API_STREAM
});
player.attachMediaElement(video);
player.load();
player.play();
}
}, [videoRef])
return <video ref={videoRef}></video>
}similar issue here: https://github.com/xqq/mpegts.js/issues/19
Full output of "yarn build": flvjs-error.txt
my package.json is { "name": "goblitz-frontend", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve --aot", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e", "compile:server": "webpack --config webpack.server.config.js --progress --colors", "serve:ssr": "node dist/server", "build:ssr": "npm run build:client-and-server-bundles && npm run compile:server", "build:client-and-server-bundles": "ng build --prod && ng run goblitz-frontend:server:production --bundleDependencies all" }, "private": true, "dependencies": { "@angular/animations": "~8.2.14", "@angular/common": "~8.2.14", "@angular/compiler": "~8.2.14", "@angular/core": "~8.2.14", "@angular/fire": "^5.0.0", "@angular/forms": "~8.2.14", "@angular/platform-browser": "~8.2.14", "@angular/platform-browser-dynamic": "~8.2.14", "@angular/platform-server": "~8.2.14", "@angular/router": "~8.2.14", "@ctrl/ngx-emoji-mart": "^1.0.6", "@nguniversal/express-engine": "^8.2.6", "@nguniversal/module-map-ngfactory-loader": "8.1.1", "@syncfusion/ej2-angular-calendars": "^17.4.51", "@types/jquery": "^3.3.31", "express": "^4.15.2", "firebase": "^5.9.0", "flv.js": "^1.5.0", "jquery": "^3.4.1", "moment": "^2.24.0", "ng2-material-dropdown": "^0.11.0", "ngx-chips": "^2.1.0", "ngx-owl-carousel": "^2.0.7", "ngx-select-dropdown": "^1.3.1", "ngx-socket-io": "^3.0.1", "ngx-toastr": "^11.2.1", "rxjs": "~6.5.5", "tslib": "^1.9.0", "underscore": "^1.9.2", "zone.js": "~0.9.1" }, "devDependencies": { "@angular-builders/custom-webpack": "^8.4.0", "@angular-devkit/build-angular": "^0.803.8", "@angular/cli": "~8.3.26", "@angular/compiler-cli": "~8.2.14", "@angular/language-service": "~8.2.14", "@types/jasmine": "~3.3.8", "@types/jasminewd2": "~2.0.3", "@types/node": "~8.9.4", "codelyzer": "^5.0.0", "jasmine-core": "~3.4.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~4.1.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "~2.0.1", "karma-jasmine": "~2.0.1", "karma-jasmine-html-reporter": "^1.4.0", "postcss-import": "^12.0.1", "postcss-loader": "^3.0.0", "postcss-scss": "^2.0.0", "protractor": "~5.4.0", "tailwindcss": "^1.1.4", "ts-loader": "^5.2.0", "ts-node": "~7.0.0", "tslint": "~5.15.0", "typescript": "~3.5.3", "webpack-cli": "^3.1.0" } }