After running the yarn build getting the dist folder. While running the index.html I am getting the white blank page.
File structure:-
:~/Desktop/web$ ls
babel.config.js docs node_modules public src yarn.lock
dist log package.json README.md vue.config.js
vue.config.js
module.exports = {
publicPath: "./",
chainWebpack: config => {
config.plugins.delete('prefetch');
},
devServer: {
host: 'localhost',
https: false,
port: 8080,
public: 'localhost'
},
}
Web Page Output:-
Console Output:-
OneSignalError.js:18 Uncaught (in promise) f: OneSignal: This web push config can only be used on https://example.com. Your current origin is http://localhost:8080.
at Function.checkRestrictedOrigin (https://cdn.onesignal.com/sdks/OneSignalPageSDKES6.js?v=151508:1:243516)
at Function.<anonymous> (https://cdn.onesignal.com/sdks/OneSignalPageSDKES6.js?v=151508:1:243076)
at Generator.next (<anonymous>)
at r (https://cdn.onesignal.com/sdks/OneSignalPageSDKES6.js?v=151508:1:716)
GET http://localhost:8080/sockjs-node/info?t=1632898657676 net::ERR_CONNECTION_REFUSED
GET http://localhost:8080/sockjs-node/info?t=1632898659676 net::ERR_CONNECTION_REFUSED
GET http://localhost:8080/sockjs-node/info?t=1632898662675 net::ERR_CONNECTION_REFUSED
The problem is that you are testing OneSignal with your local server from Vue, but you have entered in the OneSingal configuration corbid360.com as your URL. What you have to do to test OneSignal is to change the URL inside of the OneSignal dashboard to the local server from your Vue project. Once you have tested it in your local environment, you can change it back to corbid360.com
Most likely the reason is that you need to specify to OneSignal that you are using localhost.
Select Typical setup
Enter your localhost URL
Enable Local Testing
(Treat HTTP localhost as HTTPS for testing)
Come join us in our discord server and learn more about our community and OneSignal: https://onesignal.com/onesignal-developers
I had spent a lot of time on this issue, at last, I got the solution. on list post https://stackoverflow.com/a/60239175/13178120. if you are getting this type of error you can go through with the above link.
Related
I have seen a question with a very similar title on SO from 3 months ago but it has no answers.
After a fresh laravel 9 installation what are the minimum steps to put the laravel application into it's own directory, and also modify the public directory name? It would be handy to have a step by step guide with laravel 9 specific one as I can't seem to find one anywhere.
eg. the following root directory structure:
laravel-app/ (contains all laravel files like resources/ and storage/)
public_html/ (contains index.php and /js etc)
Using the old process (similar to this https://github.com/hannanstd/change-laravel-public) I have always used no longer works, and this seems to have something to do with vite that laravel 9 uses instead of laravel-mix. It works up to the point of running php artisan serve but fails when running npm run dev with vite. Giving this error:
$ npm run dev
> dev
> vite
(!) Could not auto-determine entry point from rollupOptions or html files and there are no explicit optimizeDeps.include patterns. Skipping dependency
pre-bundling.
node:internal/fs/utils:347
throw err;
^
Error: ENOENT: no such file or directory, open 'public\hot'
at Object.openSync (node:fs:594:3)
at Object.writeFileSync (node:fs:2207:35)
at Server.<anonymous> (D:\Websites\laravel9-admin\laravel-core\node_modules\laravel-vite-plugin\dist\index.js:122:34)
at Object.onceWrapper (node:events:627:28)
at Server.emit (node:events:525:35)
at emitListeningNT (node:net:1466:10)
at processTicksAndRejections (node:internal/process/task_queues:82:21) {
errno: -4058,
syscall: 'open',
code: 'ENOENT',
path: 'public\\hot'
}
So it seems that yet somewhere else the default "public/" is defined, but after searching with ctrl+shift+F in my project it doesn't seem to be anywhere that matters so really unsure where it's getting it from. Any help is highly appreciated, but really a step by step guide on how to achieve this for Laravel 9 is the end goal so it can be a reference for myself and other users with the same problem :)
Answering this myself as found the solution!
First Option: Just rename the public/ directory, for laravel 9:
Rename public folder to public_html (or any desired name)
Edit AppServiceProviver.php and add below code in register method:
$this->app->bind('path.public', function() {
return realpath(base_path().'/public_html');
});
Add publicDirectory: 'public_html' to laravel-core/vite.config.js within the plugins / laravel object, eg.
export default defineConfig({
plugins: [
laravel({
publicDirectory: 'public_html',
input: [
'resources/sass/app.scss',
'resources/js/app.js',
],
refresh: true,
}),
],
});
Second option: Seperate out the laravel core files into their own directory and also rename the public/ directory, for laravel 9:
Rename public folder to public_html (or any desired name)
Create a laravel-core directory and move all files and folders except public_html into the laravel-core folder.
Edit index.php in public_html folder and find/replace __DIR__.'/../ with __DIR__.'/../laravel-core/ (3 cases)
Edit AppServiceProviver.php and add below code in register method:
$this->app->bind('path.public', function() {
return realpath(base_path().'/../public_html');
});
Add publicDirectory: 'public_html' to laravel-core/vite.config.js within the plugins / laravel object, eg.
export default defineConfig({
plugins: [
laravel({
publicDirectory: '../public_html',
input: [
'resources/sass/app.scss',
'resources/js/app.js',
],
refresh: true,
}),
],
});
Im having issues deploying a project on Vercel. On my local machine the app is working as expected. Yet on the live site I'm running into a 500 internal error message. The project uses MongoDB and Next-Auth. In the .env.local file I created a env variable for NEXTAUTH_URL = localhost/3000. In Vercel, I created a NEXTAUTH_URL = "project-site" env variable for production. At the moment there isn't any MongoDB env variable set up. The error message in the function logs reads out
[GET] /_next/data/A8gtiRNZmw7m2Db85BoGe/suggestions.json
15:40:24:81
2022-05-26T19:40:26.691Z e41995a4-dac5-4f4e-aa1c-fbbcd2787d91 ERROR [Error: ENOENT: no such file or directory, open '/var/task/public/data/data.json'] {
errno: -2,
syscall: 'open',
path: '/var/task/public/data/data.json',
page: '/suggestions'
}
RequestId: e41995a4-dac5-4f4e-aa1c-fbbcd2787d91 Error: Runtime exited with error: exit status 1
Runtime.ExitError
Any tips are greatly appreciated.
Working on a React project.
I start up my environment using npm start. I then start my testing infrastructure using npm test in a different terminal. While my tests are running, errors are generated and printed in the terminal that my environment is running in.
npm start
Compiled successfully!
You can now view v2 in the browser.
Local: http://localhost:3000
Note that the development build is not optimized.
To create a production build, use yarn build.
Open another terminal and run npm test
Test Suites: 1 passed, 1 total
Tests: 3 passed, 3 total
Snapshots: 0 total
Time: 2.415s
Ran all test suites.
Yet, some UI errors that the tests generate appear in the terminal for my local environment
Compiled successfully!
You can now view v2 in the browser.
Local: http://localhost:3000
Note that the development build is not optimized.
To create a production build, use yarn build.
[HPM] Error occurred while trying to proxy request /directory from localhost:3000 to <TARGET> (ECONNRESET) (https://nodejs.org/api/errors.html#errors_common_system_errors)
[HPM] Error occurred while trying to proxy request /directory from localhost:3000 to <TARGET> (ECONNRESET) (https://nodejs.org/api/errors.html#errors_common_system_errors)
[HPM] Error occurred while trying to proxy request /directory from localhost:3000 to <TARGET> (ECONNRESET) (https://nodejs.org/api/errors.html#errors_common_system_errors)
[HPM] Error occurred while trying to proxy request /directory from localhost:3000 to <TARGET> (ECONNRESET) (https://nodejs.org/api/errors.html#errors_common_system_errors)
[HPM] Error occurred while trying to proxy request /directory from localhost:3000 to <TARGET> (ECONNRESET) (https://nodejs.org/api/errors.html#errors_common_system_errors)
How do I prevent errors - and anything else for that matter - from being printed out to the terminal where I started my dev environment?
looking at the output of your npm test, it seems like you are using jest, which has a support for configuring setup files
A list of paths to modules that run some code to configure or set up the testing framework before each test file in the suite is executed.
you can utilize it by pointing to a file, where you can mock the implmentation for console.
add to jest.config.js the following
module.exports = {
setupFilesAfterEnv: ['./jest.setup.js'],
};
then in jest.setup.js file
global.beforeAll(() => {
// disable console.error for clarity
console.error = jest.fn().mockImplementation(() => {});
});
note that it will achieve what you desire only if the module that prints to the console during the testing is using console.error(). otherwise, you might need to mock other functions, such as console.info(), console.log(), console.debug()
I have a project that's been running perfectly for a few months now, able to run npm run serve with no problem. I have to terminate and run the command again whenever I switch networks, but that has never been a problem and the server could always start again.
Until now - no matter what I do I can't get the server to start. I get this error:
npm run serve
> xbs#0.6.2 serve D:\workspace\[PROJECT]
> vue-cli-service serve
INFO Starting development server...
10% building 1/1 modules 0 active ERROR TypeError: Cannot read property 'upgrade' of undefined
TypeError: Cannot read property 'upgrade' of undefined
at Server.<anonymous> (D:\workspace\[PROJECT]\node_modules\webpack-dev-server\lib\Server.js:667:47)
at Array.forEach (<anonymous>)
at new Server (D:\workspace\[PROJECT]\node_modules\webpack-dev-server\lib\Server.js:666:22)
at serve (D:\workspace\[PROJECT]\node_modules\#vue\cli-service\lib\commands\serve.js:137:20)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)
at Function.Module.runMain (module.js:695:11)
at startup (bootstrap_node.js:191:16)
at bootstrap_node.js:612:3
The last time I got this message was when I forgot to set the .env files, but this is a previously working copy with all necessary files set, and no changes since the last working run.
I've even tried pulling a fresh copy of the repo, running npm i and setting all env files but it still fails.
npm run lint and npm run build can still work, only npm run serve.
Am I missing anything?
The problem was again with the .env files. My vue.config.js was trying to access a previously set environment variable that had since been removed.
Only strange thing was that there weren't any problems up til now?
I guess your devServer.proxy.target is empty!
You could set this configuration
For me it was that I forgot to create (or copy from another PC) the .env file after clone and try to run my project on another PC.
I also had this problem.
I used in the project process to get the backend address(for example):
devServer: {
proxy: {
'/api/back/*': {
target: process.env.VUE_APP_BACKEND_URL,
pathRewrite: {
'/api/back': '/api/back',
},
},
},
},
But there was no .evn file.
Just create .env file:
VUE_APP_BACKEND_URL= 0.0.0.0:2222 #example
Didn't notice the answer #Sergey.
I declared this environment variable in .env.dev, but the local build failed, and the same project ran without problems, so I created a new .env file and declared it in it
proxy: {
'/api': {
target: process.env.VUE_APP_PROXY,
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
}
I have using browserify for new project. It works really well so far.
I have one big issue though. How can I debug each js file separately. It bundles all the files together and points to bundle if error occurs.
I am using chrome and source maps but it doesn't really help in debugging.
Any ideas?
Update: More info:
I'm using this command in package.json
"start": "watchify scripts/main.js -o scripts/bundle.js --debug",
and getting errors as shown above which is not ideal.
I believe my source maps are on?
I'm not exactly sure how you are using the command line tool for browserify without any code, but you you should be able to utilize debug.
--debug -d Enable source maps that allow you to debug your files
separately.
browserify main.js -o bundle.js --debug
For more info on the CLI tool you can look here - https://github.com/substack/node-browserify#usage
Edit After a bit more digging on this - the issue specifically being hit here is a ParseError - which means that Browserify is never actually getting to the proper debug stage. Hadn't really thought it through, but this made perfect sense.
In order to test this - I create two simple files:
a.js
module.exports = function(a) {
return a;
}
main.js
var a = require('./a.js');
console.log(a("something"));
I then ran browserify using watchify with an npm script:
"start": "watchify main.js -o bundle.js --debug"
Using the script in a browser, and everything worked great - it logged to console as expected. I then edited a.js with a typo:
a.js
module.exports = function(a) {
return a---
}
The browser and watchify threw the error shown above: path/to/file/a.js:3 ParseError: Unexpected Token.
Browserify is not able to compile the file properly, so it's throwing an error. You should be seeing this in the console during the build.
To test that the --debug flag works as expected, I modified the code again:
a.js
module.exports = function(a) {
return a('something');
}
The expectation here would be a TypeError since the function now expects a to be a function.
The console in the browser now displays:
Uncaught TypeError: a is not a function __________ a.js:2
Fix your parse issues, and browserify --debug will once again start behaving as expected.