Error Deploying VueJs App (Laravel) - ReferenceError: window is not defined - javascript

I have this problem at the time of deploying Vue with Laravel.
I have node js 12 and laravel 6 installed, everything is correct but when I start the application I get that error:
/var/www/vhosts/domain.com/cl.domain.com/resources/js/app.js:3
global.window = window;ยด
ReferenceError: window is not defined
at Object.<anonymous> (/var/www/vhosts/domain.com/cl.domain.com/resources/js/app.js:3:17)
at Module._compile (internal/modules/cjs/loader.js:774:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:785:10)
at Module.load (internal/modules/cjs/loader.js:641:32)
at Function.Module._load (internal/modules/cjs/loader.js:556:12)
at Module.require (internal/modules/cjs/loader.js:681:19)
at Module.require (/usr/share/passenger/helper-scripts/node-loader.js:80:25)
at require (internal/modules/cjs/helpers.js:16:16)
at loadApplication (/usr/share/passenger/helper-scripts/node-loader.js:243:2)
at setupEnvironment (/usr/share/passenger/helper-scripts/node-loader.js:214:2)
My code:
require('./bootstrap');
window.Vue = require('vue');
require('vue-flash-message');
require('vue-flash-message/dist/vue-flash-message.min.css');
Vue.use(VueFlashMessage);

Related

npx react-native init MainApp Giving error (code: 'MODULE_NOT_FOUND',) . What's the isue here

I got this error while running the above command (npx react-native init MainApp)
I have installed the latest version of node and npm. I am not sure why this error is reflected.
Tried clearing the cache changing the node version to 17 but no luck. I am new to this react native.
node:internal/modules/cjs/loader:936
throw err;
^
Error: Cannot find module './error'
Require stack:
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#hapi\hoek\lib\assert.js
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#hapi\topo\lib\index.js
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#react-native-community\cli\node_modules\joi\lib\types\keys.js
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#react-native-community\cli\node_modules\joi\lib\types\function.js
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#react-native-community\cli\node_modules\joi\lib\index.js
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#react-native-community\cli\build\tools\config\schema.js
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#react-native-community\cli\build\tools\config\readConfigFromDisk.js
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#react-native-community\cli\build\tools\config\index.js
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#react-native-community\cli\build\commands\install\install.js
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#react-native-community\cli\build\commands\index.js
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#react-native-community\cli\build\index.js
- C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#react-native-community\cli\build\bin.js
at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
at Function.Module._load (node:internal/modules/cjs/loader:778:27)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (node:internal/modules/cjs/helpers:102:18)
at Object.<anonymous> (C:\Users\priye\AppData\Local\npm-cache\_npx\7930a8670f922cdb\node_modules\#hapi\hoek\lib\assert.js:3:21)
at Module._compile (node:internal/modules/cjs/loader:1101:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
at Module.load (node:internal/modules/cjs/loader:981:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:1005:19) {
code: 'MODULE_NOT_FOUND',
requireStack: [
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#hapi\\hoek\\lib\\assert.js',
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#hapi\\topo\\lib\\index.js',
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#react-native-community\\cli\\node_modules\\joi\\lib\\types\\keys.js',
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#react-native-community\\cli\\node_modules\\joi\\lib\\types\\function.js',
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#react-native-community\\cli\\node_modules\\joi\\lib\\index.js',
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#react-native-community\\cli\\build\\tools\\config\\schema.js',
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#react-native-community\\cli\\build\\tools\\config\\readConfigFromDisk.js',
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#react-native-community\\cli\\build\\tools\\config\\index.js',
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#react-native-community\\cli\\build\\commands\\install\\install.js',
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#react-native-community\\cli\\build\\commands\\index.js',
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#react-native-community\\cli\\build\\index.js',
'C:\\Users\\priye\\AppData\\Local\\npm-cache\\_npx\\7930a8670f922cdb\\node_modules\\#react-native-community\\cli\\build\\bin.js'
]
}
Hi I myself resolved the issue. I deleted the npm-cache folder from the AppData folder and it worked :). Thanks

'Blob is not defined' error in async-array-buffer. How to fix it?

I'm getting error when trying start SSR and import { AudioContext } from standardized-audio-context
/workspace/node_modules/async-array-buffer/build/es5/bundle.js:10
var blob = new Blob([worker], {
^
ReferenceError: Blob is not defined
at /workspace/node_modules/async-array-buffer/build/es5/bundle.js:10:13
at /workspace/node_modules/async-array-buffer/build/es5/bundle.js:2:65
at Object.<anonymous> (/workspace/node_modules/async-array-buffer/build/es5/bundle.js:5:2)
at Module._compile (internal/modules/cjs/loader.js:689:30)
at Module._compile (/workspace/node_modules/pirates/lib/index.js:83:24)
at Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Object.newLoader [as .js] (/workspace/node_modules/pirates/lib/index.js:88:7)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
error Command failed with exit code 1.
How to possible to fix and where i need start to dig?
First of all, install the below package
-> npm install blob-polyfill
After that go to server.ts file, make an import and add blob to global.
-> import { Blob } from 'blob-polyfill'
-> global['Blob'] = Blob
I guess now you are all set to go.

Angular 2 "require is not defined"

I am working on an app, which previously worked. I am now trying to add some routing, so have created an app.component file and changed a few parameters, but now I just get a blank screen and this error in the console...
Error: ReferenceError: require is not defined
at eval (http://localhost:3000/client/dev/main.js:2:17)
at eval (http://localhost:3000/client/dev/main.js:6:3)
at $ (http://localhost:3000/node_modules/systemjs/dist/system-polyfills.js:4:8740)
Evaluating http://localhost:3000/client/dev/main.js
Error loading http://localhost:3000/client/dev/main.js
My Main.JS file is:
"use strict";
var browser_1 = require('angular2/platform/browser');
var app_component_1 = require('./app.component');
browser_1.bootstrap(app_component_1.AppComponent);
This is Generated from main.ts:
import { bootstrap } from 'angular2/platform/browser';
import { AppComponent } from './app.component';
bootstrap(AppComponent);
Whats's wrong with this?
Update:
Thanks Eric for your suggestion about using the system module in tsconfig.json, but if I do it, I get the following error:
C:\Users\George\Source\Repos\Gen-App\server\server.js:2
System.register(['express', 'os', 'http', './config/routes.conf', './config/db.conf', './config/passport', './routes/index'], function(exports_1, context_1) {
^
ReferenceError: System is not defined
at Object.<anonymous> (C:\Users\George\Source\Repos\Gen-App\server\server.js:2:1)
at Module._compile (module.js:413:34)
at Object.Module._extensions..js (module.js:422:10)
at Module.load (module.js:357:32)
at Function.Module._load (module.js:314:12)
at Module.require (module.js:367:17)
at require (internal/module.js:16:19)
at Object.<anonymous> (C:\Users\George\Source\Repos\Gen-App\index.js:1:63)
at Module._compile (module.js:413:34)
at Object.Module._extensions..js (module.js:422:10)
NB: my server.js code is here
You say you added some routing and now it's not working. Your index.html file needs to include the router.dev.js file:
<script src="node_modules/angular2/bundles/router.dev.js"></script>

Mocha: ReferenceError: window is not defined when testing react with shallow rendering?

I'm new to the unit testing world with React, and was following along with an egghead video on the subject. In trying out shallow rendering, tests only work with some of my components.
A few of my components, however, contain charts made using react-chartist and the chartist library. When attempting to run tests on those components, I get this error:
> kindred-web-healthreader#0.0.1 test /Users/HilaryMBP/Kindred/kindred-web-healthreader
> mocha './src/**/*.spec.js' --compilers js:babel/register
/Users/HilaryMBP/Kindred/kindred-web-healthreader/node_modules/chartist/dist/chartist.js:958
}(window, document, Chartist));
^
ReferenceError: window is not defined
at /Users/HilaryMBP/Kindred/kindred-web-healthreader/node_modules/chartist/dist/chartist.js:958:3
at Chartist.version (/Users/HilaryMBP/Kindred/kindred-web-healthreader/node_modules/chartist/dist/chartist.js:11:22)
at Object.<anonymous> (/Users/HilaryMBP/Kindred/kindred-web-healthreader/node_modules/chartist/dist/chartist.js:15:2)
at Module._compile (module.js:425:26)
at Module._extensions..js (module.js:432:10)
at Object.require.extensions.(anonymous function) [as .js] (/Users/HilaryMBP/Kindred/kindred-web-healthreader/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:214:7)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:313:12)
at Module.require (module.js:366:17)
at require (module.js:385:17)
at Object.<anonymous> (/Users/HilaryMBP/Kindred/kindred-web-healthreader/src/js/utils/ChartistUtils.js:13:17)
at Module._compile (module.js:425:26)
at normalLoader (/Users/HilaryMBP/Kindred/kindred-web-healthreader/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:199:5)
at Object.require.extensions.(anonymous function) [as .js] (/Users/HilaryMBP/Kindred/kindred-web-healthreader/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:216:7)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:313:12)
at Module.require (module.js:366:17)
at require (module.js:385:17)
at /Users/HilaryMBP/Kindred/kindred-web-healthreader/node_modules/mocha/lib/mocha.js:219:27
at Array.forEach (native)
at Mocha.loadFiles (/Users/HilaryMBP/Kindred/kindred-web-healthreader/node_modules/mocha/lib/mocha.js:216:14)
at Mocha.run (/Users/HilaryMBP/Kindred/kindred-web-healthreader/node_modules/mocha/lib/mocha.js:468:10)
at Object.<anonymous> (/Users/HilaryMBP/Kindred/kindred-web-healthreader/node_modules/mocha/bin/_mocha:403:18)
at Module._compile (module.js:425:26)
at Object.Module._extensions..js (module.js:432:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:313:12)
at Function.Module.runMain (module.js:457:10)
at startup (node.js:138:18)
at node.js:974:3
This only happens with components whose children import Chartist or react-chartist.
Here's my test file that's not working, for reference:
import React from 'react';
import TestUtils from 'react-addons-test-utils';
import expect from 'expect';
import expectJSX from 'expect-jsx';
import Pain from '../components/Pain/Pain.jsx';
expect.extend(expectJSX);
describe('Pain', () => {
it('should render', () => {
const renderer = TestUtils.createRenderer();
renderer.render(<Pain />);
const actual = renderer.getRenderOutput();
const expected = '';
expect(actual).toIncludeJSX(expected);
});
});
What could be happening here?

Node and Require import error in Mocha?

I have a working Node application and I'm trying to add Mocha tests, but getting some odd import errors.
This is my file structure:
package.json
index.js
src/
chart.js
highcharts-options.js
test/
test_chart.js
This is what my chart.js file looks like:
var chartOptions = require('./highcharts-options');
var analyseChart = {
doSomething: function() { ... }
};
module.exports = analyseChart;
And this is what highcharts-options.js looks like:
var HighCharts = require('highcharts-browserify');
Highcharts.theme = { ... };
Currently I import everything from /src into a single index.js file, then bundle it with browserify, which works just fine, no errors in the application.
Now I want to start writing Mocha tests for the functions in /src.
This is my first stub in test_chart.js:
var chart = require('../src/chart');
chart.doSomething();
But when I run mocha, I get the following error:
Users/.../js/src/highcharts-options.js:11
Highcharts.theme = {
^
ReferenceError: Highcharts is not defined
at Object.<anonymous> (/Users/.../js/src/highcharts-options.js:11:1)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object.<anonymous> (/Users/.../js/src/chart.js:7:20)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object.<anonymous> (/Users/.../js/test/test_chart.js:1:75)
How can I fix this import error for Mocha?
var HighCharts = require('highcharts-browserify');
Highcharts.theme = { ... };
You have a spelling error.
High[cC]harts
How did you not notice this yourself even when you were told exactly what was wrong?
Some errors are so common that we ultimately stop trusting them, and start looking for other faults in our code without even investigating it.
This is especially true for the "someVar is undefined" error in javascript.
Takeaway:
Sometimes you just got to trust your error messages.

Categories