Why can I not build create-react-app on ec2? - javascript

I've been playing with create-react-app for a little bit now on my local machine. I also create a basic express app that I'm running on my ec2 instance and so I wanted to push my create-react-app based project onto the ec2 and serve the build. The two commands of interest are npm run start and npm run build.
Unfortunately when running npm start (i believe 'run' isn't necessary for the command actually) on the ec2, I get a ton of errors.
[ec2-user#ip-172-31-62-133 ab-site-2017-summer]$ npm start
> ab-site#0.1.0 start /home/ec2-user/ab-site-2017-summer
> react-scripts start
/home/ec2-user/ab-site-2017-summer/node_modules/react-scripts/scripts/start.js:33
const {
^
SyntaxError: Unexpected token {
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:373:25)
at Object.Module._extensions..js (module.js:416:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Function.Module.runMain (module.js:441:10)
at startup (node.js:139:18)
at node.js:968:3
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! ab-site#0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the ab-site#0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/ec2-user/.npm/_logs/2017-06-26T03_51_22_790Z-debug.log
note: that I did notice some problems when npm install'ing the node_modules for this project on the ec2. I'm also not 100% (as a non-web-dev) whether my fundamental approach here is correct. My goal is to build the dist asset with npm build and than point my express app to serve the index.html file for my domain's index route. My front-end, through react-router should handle all the UI and front-end routing from there.

Per the create-react-app README
, you'll need to have Node >= 6 installed on your EC2 instance in order to build and run the app (the poster is using Node 4.4.5).
The error you are seeing is that Node 4 doesn't know how to handle ES6 destructuring syntax, which wasn't introduced until Node 6.4.0 (see http://node.green).

Related

How do I run a JavaScript project with no package.json file present, which therefore gives error when running it?

I am trying to run this project. It has no package.json file in it. Being an absolute noob with JS, with no JS experience whatsoever, I searched online how to run JS projects. Every link I found seems to assume that the file package.json is present. So, you typically do a "npm install" and then "npm start". But since there's no "package.json" file present in this project, running "npm install" doesn't do anything. But when I do "npm start", I get this error:
npm ERR! code ENOENT
npm ERR! syscall open
npm ERR! path /Users/username/Downloads/Face-Detection-JavaScript-master/package.json
npm ERR! errno -2
npm ERR! enoent ENOENT: no such file or directory, open '/Users/username/Downloads/Face-Detection-JavaScript-master/package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/username/.npm/_logs/2020-08-26T04_51_15_254Z-debug.log
So, how do I run this project?
I tried the solutions given here and here, but to no avail.
I also tried node script.js, but I get the following error:
const video = document.getElementById('video')
^
ReferenceError: document is not defined
at Object.<anonymous> (/Users/username/Downloads/Face-Detection-JavaScript-master/script.js:1:15)
at Module._compile (internal/modules/cjs/loader.js:1133:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1153:10)
at Module.load (internal/modules/cjs/loader.js:977:32)
at Function.Module._load (internal/modules/cjs/loader.js:877:14)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:74:12)
at internal/main/run_main_module.js:18:47
When I open the index.html file in browser, I just get a blank page:
This doesn't have anything to do with Node.js. All you have to do is open the HTML file in your browser.
This is if you want to run javascript with node, for which you need to have node and npm installed, (installation link here), and initialize an node project with npm init --y to generate a package.json
But, in this case though, you just need to run the html file on your browser, and the javascript code will run on the browser, so you don't need to do all that.
Only nodeJS projects need package.json . You can run your javascript project by putting your index.html or main file directly on browser

I'm facing a problem with npm run serve ( vue js project )

I am getting an error when trying to run npm run serve.
At fist I tried to work with vue in laravel project and run the "npm run serve command".
After that I uninstalled vue as well as vue/cli and reinstall them again. Then i created new vue project in independent folder. But when I am trying to run server as -> npm run serve at I'm getting the same error as when i tried it in the laravel project.
I used below codes for installation:
npm run serve => the vue and laravel project
npm run dev => the laravel project
This is the error :
$ npm run serve
vue-1#0.1.0 serve P:\codes & projects\vue\Tutorials\vue-1
vue-cli-service serve
'projects\vue\Tutorials\vue-1\node_modules\.bin\' is not recognized as an intern
al or external command,
operable program or batch file.
internal/modules/cjs/loader.js:1032
throw err;
^
Error: Cannot find module 'P:\#vue\cli-service\bin\vue-cli-service.js'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:1029:15)
at Function.Module._load (internal/modules/cjs/loader.js:898:27)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js
:71:12)
at internal/main/run_main_module.js:17:47 {
code: 'MODULE_NOT_FOUND',
requireStack: []
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! vue-1#0.1.0 serve: vue-cli-service serve**
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the vue-1#0.1.0 serve script.
npm ERR! This is probably not a problem with npm. There is likely additional log
ging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\ahmad\AppData\Roaming\npm-cache\_logs\2020-09-13T16_12_03_
919Z-debug.log
And This is an image for the error in the bash terminal :
enter image description here

issue when running npm run serve in vue project

I've got an issue when try running server for vue project
this is the issue
ERROR Error: No valid exports main found for
' PROJECT PATH\node_modules\colorette'
Error: No valid exports main found for
'PROJECT PATH\node_modules\colorette'
at resolveExportsTarget (internal/modules/cjs/loader.js:622:9)
at applyExports (internal/modules/cjs/loader.js:499:14)
at resolveExports (internal/modules/cjs/loader.js:548:12)
at Function.Module._findPath (internal/modules/cjs/loader.js:654:22)
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:953:27)
at Function.Module._load (internal/modules/cjs/loader.js:859:27)
at Module.require (internal/modules/cjs/loader.js:1028:19)
at require (internal/modules/cjs/helpers.js:72:18)
at Object. (C:\Users\AlaaMohammed\PhpstormProjects\vue-2\node_modules\autoprefixer\lib\autoprefixer.js:5:17)
at Module._compile (internal/modules/cjs/loader.js:1139:30) npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! vue-2#0.1.0 serve:
vue-cli-service serve npm ERR! Exit status 1 npm ERR! npm ERR!
Failed at the vue-2#0.1.0 serve script. npm ERR! This is probably not
a problem with npm. There is likely additional logging output above.
I want some to response to my problem
try to reinstall the colerette plugin version 1.2.0 manually
npm i colorette#1.2.0
Upgrade node to version 14.5 will resolve this issue.
I did the following and it worked:
1)_ First i checked the versions
npm outdated
npm update
npm install
npx npm-check-updates - u
2)_ Once i was 100% sure the problems didn't come from that source, i typed the following:
npm install autoprefixer#9.8.0
and it solved the problem.
Note: try to "npm start" before you connect the scss to the App, just to see if you can visualize something (like: hello world) in the browser, if everything is fine, create the folder scss with the main.scss inside of it, import it and then try the steps.
My node -v: v16.1.0
What worked for me npm ci
Updating the node version can solve your problem.

how to run an existing project of react native

I wanted to download and run someone else's project in order to consider its functions. I ran into a number of problems ... that it does not deign to start, and I just don’t know what to do, help, please
https://github.com/sunlight3d/react_native_v0.49/tree/master/61-Realm%20React%20Native%235.Filter%20data%20and%20working%20with%20To-Many%20Relationships/code/tutorialProject
1) copied to the working folder tutorial project
2) opened VS code
3) went into the working folder and clicked open in cmd folder tutorial project
4) then I enter react-native run-android
and get fiasco
d:\JS\tutorialProject>react-native init tutorialProject
internal/modules/cjs/loader.js:657 throw err; ^
Error: Cannot find module 'graceful-fs' at
Function.Module._resolveFilename
(internal/modules/cjs/loader.js:655:15) at Function.Module._load
(internal/modules/cjs/loader.js:580:25) at Module.require
(internal/modules/cjs/loader.js:711:19) at require
(internal/modules/cjs/helpers.js:14:16) at Object.<anonymous>
(d:\JS\tutorialProject\node_modules\react-native\local-cli\cli.js:12:1)
at Module._compile (internal/modules/cjs/loader.js:805:30) at
Object.Module._extensions..js (internal/modules/cjs/loader.js:816:10)
at Module.load (internal/modules/cjs/loader.js:672:32) at
tryModuleLoad (internal/modules/cjs/loader.js:612:12) at
Function.Module._load (internal/modules/cjs/loader.js:604:3)
I started googling and found something to do with some dependencies. Using react-native init MyProject
5) react-native init tutorialProject and getting the tighter right line
I try to start the server through npm and then it's funny ...
6) npm-intall
d:\JS\tutorialProject>npm install npm WARN deprecated core-js#1.2.7:
core-js#<2.6.5 is no longer maintained. Please, upgrade to core-js#3
or at least to actual version of core-js#2. npm WARN deprecated
connect#2.30.2: connect 2.x series is deprecated npm ERR! path
d:\JS\tutorialProject\node_modules\.bin\react-native npm ERR! code
EEXIST npm ERR! Refusing to delete
d:\JS\tutorialProject\node_modules\.bin\react-native: is outside
d:\JS\tutorialProject\node_modules\react-native and not a link npm
ERR! File exists: d:\JS\tutorialProject\node_modules\.bin\react-native
npm ERR! Move it away, and try again.
npm ERR! A complete log of this run can be found in: npm ERR!
C:\Users\Nick\AppData\Roaming\npm-cache\_logs\2019-04-16T18_15_13_614Z-debug.log
and here I am absolutely don't know. How to run someone else's project?
When you download after you need to install all package in package.json
npm install --save
then you need to start another terminal
npm start -- --reset-cache / npm start / react-native start
It's for starting your bundler
finally you can run your project
react-native run-android
From a computer with node install, you navigate a command line to the root of the project folder.
Then you install dependencies:
npm i
This installs all the libraries the project needs to build
Then you run the projects build script. This is defined in the projects package.json file. In that projects case, the script is called start. So:
npm run start
all dependencies and plugins have configured in package.json file. so you need to install:
npm install
then, you can start
react-native run-android
or
npm run start
if you already have a bundle app (android or ios ...)
react-native run-android / react-native run-ios
else you should run
react-native start
and then run :
react-native run-android (or ios)
This is the answer when you compile on windows and android studio
1.Open cmd(as an admin)
2. Npm install
3. Wait for build gradle in Android studio done compiling
4. Run on cmd react-native android-run
Sometimes you may get this error (refer image below)
This is a failure to build because of gradle error. To solve this, you may try to delete the files/folder in the error message and run again react-native android-run.
Just run
npm cache clean --force
npm i or npm install
Install Chocolatey
Chocolatey is a popular package manager for Windows. So at first, we need to install it on our system.
To install Chocolaty, Open Command Prompt with administrator privileges and run the command below.
#"%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe" -NoProfile -InputFormat None -ExecutionPolicy Bypass -Command "[System.Net.ServicePointManager]::SecurityProtocol = 3072; iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"
choco install -y nodejs.install python2 jdk8.
npm install –g react-native-cli
More Detail Follow this
Path in user variable upper section

Nodejs npm scripts fail with "SyntaxError: Unexpected token {"

I've just imported my Reactjs project to a new machine on Ubuntu and installed most dependencies with npm install successfully bar the following:
npm WARN optional Skipping failed optional dependency /react-scripts/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: fsevents#1.0.17
npm WARN optional Skipping failed optional dependency /chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: fsevents#1.1.2
Trying to run the project with npm start fails with:
> booking-frontend#0.1.0 start /root/17-visit-booker-frontend
> react-scripts start
/root/17-visit-booker-frontend/node_modules/react-scripts/scripts/start.js:33
const {
^
SyntaxError: Unexpected token {
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:374:25)
at Object.Module._extensions..js (module.js:417:10)
at Module.load (module.js:344:32)
at Function.Module._load (module.js:301:12)
at Function.Module.runMain (module.js:442:10)
at startup (node.js:136:18)
at node.js:966:3
npm ERR! Linux 4.4.0-81-generic
npm ERR! argv "/usr/bin/nodejs" "/usr/bin/npm" "start"
npm ERR! node v4.2.6
npm ERR! npm v3.5.2
npm ERR! code ELIFECYCLE
npm ERR! booking-frontend#0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the booking-frontend#0.1.0 start script 'react-scripts start'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the booking-frontend package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! react-scripts start
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs booking-frontend
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls booking-frontend
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR! /root/17-visit-booker-frontend/npm-debug.log
Attempting to run any npm script including npm run build all fails with the exact same error referencing the same lines in each file in the SyntaxError:
SyntaxError: Unexpected token {
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:374:25)
at Object.Module._extensions..js (module.js:417:10)
at Module.load (module.js:344:32)
at Function.Module._load (module.js:301:12)
at Function.Module.runMain (module.js:442:10)
at startup (node.js:136:18)
at node.js:966:3
Running the same scripts on my original machine, a Mac, succeed.
I've tried re-installing node/npm which do not fix the issue. Is the supposedly optional dependency causing this to fail?
Any help is appreciated.
You're using node.js v4 which does not by default support destructuring syntax (the const {field1, field2, ....} = object) that it is failing on.
You have two options:
Install a newer version of Node.js
Run node with the harmony flags that will enable this feature in version 4.x.

Categories

Resources