I created react project with react-scripts. After done some functionality, I tried to build the project. For this, I used npm run build command. When I run this command, I can able to generate build folder.
Now, I moved build folder to my server and tried to execute. It's give me blank white screen and saying index.js not found.
I am not sure, how to resolve this issue. Can you please help me. thanks.
Related
I need help on how should I do compile/build my project using Next.js when I use a custom server.
I actually use Nest.js (TypeScript Node.js Framework) as my Backend and wrap my Next.js inside it (since Nest.js is node based so I think this should work) and it actually working.
This is one of the tutorial that I followed: https://javascript.plainenglish.io/render-next-js-with-nestjs-did-i-just-made-next-js-better-aa294d8d2c67.
And when I tried to build production, Next.js give me error like this
So basically, when I use nest build command, it successfully compiled but only the backend part (which is Nest.js).
Whenever I tried to run into localhost, it would error and said the same thing above.
And the same as the second command (which is I tried to add next build command), it would show the same error.
I know where is the problem is (they basically need the compiled .next/ folder) but kinda confused how to solve this.
Do you have any idea on how I should tell the compiler that the pages/ folder has been moved into src/client/pages?
[EDIT]
Just for your information, this is my folder architecture.
Any kind of ideas would be a really help. Thanks guys!
I just fixed my own issue right after several minutes I post this even I've struggle for like hours!
So, just want to let you guys know if anyone ever comes with the same issue. Somehow, my solution is comes because this Next.js CLI docs, so thanks to that.
What I did is just simply change the directory first into the right Next.js folder's code and start compile it. I did it from package.json build scripts.
"scripts": {
"build": "NODE_ENV=production nest build && NODE_ENV=production cd src/client && next build"
...
}
I've downloaded this Phaser/MatterJS example from Codesandbox (->File ->Export to ZIP).
Running it locally returns this error:
Uncaught SyntaxError: Cannot use import statement outside a module - index.js:1
How to fix this?
What I tried so far:
I've installed all dependencies
Updated to latest NodeJS
Running it with a local server
Just as you have seen yourself the javascript that is written in the files is not something that the browsers understand out of the box, and so errors were thrown your way.
To send js that browsers understand, you need to use a tool like webpack, parcel. already in the project you shared parcel is used.
You have to do the following:
install the dependecies of the probject
in the root dir of the project run npm run start
parcel will bundle the files and then open an html page with the results
unfortunately when i tried this parcel did not work for me, there were errors related to JSON loading, however i have managed to get the game to work, by running npm run build, this will output for you the build files in a folder called dist.
Go to the dist folder, and start a local server there and visit the file it should work, however again for me it did not work. but i noticed that its due to parcel not getting the correct relative path of the bundled js file.
To solve that, open the index.html file in the dist folder, you will find that there is one script there
<script src="/js.d8530414.js"></script>
I had to change that to
<script src="./js.d8530414.js"></script> // because this was the correct file in my file system
After that visit the html file in the dist folder, and the game works fine.
Obviously this way of working is not conveninent, since for each change you want to see you have to build the project again using npm run build. You need to solve the problem of npm run start not working, it could be that this problem never occurs to you if you are on different os than mine. If it happens then i suggest updating parcel and trying again, if problem still persists, then you can look here since issue seems related to phaser wanting the json file as json, while parcel compiling it to javascript object.
index.html:
<script type = "module" src = "./js/index.js">
You have to tell the browser that this js file is a module, then it will change some things on the backside for you to use this. This article is very helpful for getting started with modules.
I have a react-native project where I changed my project name in package.json due to eslint warnings. Now when I try to run react-native link to link any library, I'm getting the following error:
Scanning folders for symlinks in /Users/my-username/projects/myproject-folder/node_modules (20ms)
rnpm-install info Linking assets to ios project
rnpm-install ERR! Something went wrong while linking. Error: ENOENT: no such file or directory, open '/Users/my-user-name/projects/myproject-folder/ios/my-old-app-name.xcodeproj/project.pbxproj'
So it doesn't find the file project.pbxproj, as it is looking at it from the wrong folder.
What I have tried so far with failed outcomes:
react-native upgrade
react-native-rename
Deleted node_modules and run npm install again
Renamed app name to correct in index.ios.js for AppRegistry.registerComponent
Where does react-native link look for the file project.pbxproj? If I find that location, I could rewrite it to the new correct one. I have no xcode, and currently only android version. I (still) have the separate index files for both versions, even I heard that after some react-native upgrade they should have been merged...
Was able to solve this by deleting the other project folders in the ios -folder. Apparently react-native just loops through every project there it finds, and picks the first one.
I stumbled this problem just today. Here are the steps I made to make it work again
Delete the ios folder
react-native eject // this will re generate the ios folder
react-native-link
I also did gradle clean before the earlier steps but I think its unnecessary.
I am following some TUTORIAL for a simple login example and I am using Angulario latest version. I tried to understand the logic and downloaded the code from REPOSITORY, but can someone help me to see this in action? After downloading the project I just changed the directory to downloaded folder and then issued npm install and then issued ng serve , but it's giving me different errors like angular.json couldn't be found etc., Have searched online to overcome these errors, but no luck. I think I am making blunder, but please go easy as I am new to Angular.
It is a version conflict. from angular6 requires new file angular.json which is not found on your project.
Try running
ng update #angular/cli --migrate-only --from=1.7.4
I am trying to set up an Angular2 CLI project in electron and am not quite sure where to start after getting the basic Angular piece generated by the CLI set up.
I have used Angular2 with electron successfully before, but that was not with the CLI piece.
So, for clarification, I have generated the basic Angular2 App using the Angular2 CLI. Now I am unsure of how to wire it up with Electron.
Has anyone done this before? Maybe you could provide some insight. Any tidbits of help will be greatly appreciated.
Thanks!
just figured I'd let you all know the solution I found. Turns out when you do an ng-build using the CLI it is completely dropping the dist folder and then remakes it using the src folder. This means it gets rid of the main.js, renderer.js, and package.json electron needs which are stored in the dist folder.
In order to ensure the Electron files (main.js, package.json, and renderer.js) get carried over to the Dist folder each time I use ng build, I set up a task using GulpJS to copy them to the correct location. Anyways, hope this helps anyone facing the same issue!