Can not import reactjs - javascript

I'm trying to import react, I wrote the following code:
import React from "react";
but when I write npm start in the terminal it shows me these errors:
> reactjs-basics#1.0.0 start /home/zx-coder/Downloads/reactjs-basics-master
> npm run build
> reactjs-basics#1.0.0 build /home/zx-coder/Downloads/reactjs-basics-master
> webpack -d && cp src/index.html dist/index.html && webpack-dev-server --content-base src/ --inline --hot
Hash: 2692c371e3a85309b95e Version: webpack 1.15.0 Time: 1020ms
Asset Size Chunks Chunk Names
bundle.js 166 kB 0 [emitted] main bundle.js.map 184 kB 0 [emitted] main
+ 37 hidden modules events.js:183
throw er; // Unhandled 'error' event
^
Error: listen EADDRINUSE 127.0.0.1:8080
at Object._errnoException (util.js:1022:11)
at _exceptionWithHostPort (util.js:1044:20)
at Server.setupListenHandle [as _listen2] (net.js:1367:14)
at listenInCluster (net.js:1408:12)
at GetAddrInfoReqWrap.doListen [as callback] (net.js:1517:7)
at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:97:10)
npm ERR! Linux 4.15.0-29-generic npm ERR! argv "/usr/bin/node"
"/usr/bin/npm" "run" "build" npm ERR! node v8.10.0 npm ERR! npm
v3.5.2 npm ERR! code ELIFECYCLE npm ERR! reactjs-basics#1.0.0 build:
`webpack -d &&cp src/index.html dist/index.html && webpack-dev-server
--content-base src/ --inline --hot` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the reactjs-basics#1.0.0 build script 'webpack -d
&& cp src/index.html dist/index.html && webpack-dev-server
--content-base src/ --inline --hot'. 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 reactjs-basics package, npm ERR! not
with npm itself. npm ERR! Tell the author that this fails on your
system: npm ERR! webpack -d && cp src/index.html dist/index.html
&& webpack-dev-server --content-base src/ --inline --hot npm ERR! You
can get information on how to open an issue for this project with: npm
ERR! npm bugs reactjs-basics npm ERR! Or if that isn't available,
you can get their info via: npm ERR! npm owner ls reactjs-basics
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with anysupport request:
npm ERR!
/home/zx-coder/Downloads/reactjs-basics-master/npm-debug.log
npm ERR! Linux 4.15.0-29-generic npm ERR! argv "/usr/bin/node"
"/usr/bin/npm" "start" npm ERR! node v8.10.0 npm ERR! npm v3.5.2 npm
ERR! code ELIFECYCLE npm ERR! reactjs-basics#1.0.0 start: `npm run
build` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the
reactjs-basics#1.0.0 start script 'npm run build'. 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 reactjs-basics package,
npm ERR! not with npm itself. npm ERR! Tell the author that this fails
on your system: npm ERR! npm run build npm ERR! You can get
information on how to open an issue for this project with: npm ERR!
npm bugs reactjs-basics npm ERR! Or if that isn't available, you can
get their info via: npm ERR! npm owner ls reactjs-basics npm ERR!
There is likely additional logging output above.
npm ERR! Please include the following file with anysupport request:
npm ERR!
/home/zx-coder/Downloads/reactjs-basics-master/npm-debug.log

The error is Error: listen EADDRINUSE 127.0.0.1:8080 which means there already is something that uses port 8080 on your machine, try changing the port webpack starts the dev server

solution 1: if your are beginner - just restart your PC.
solution 2: open task manager and kill all node instances.
alternatively you check if there is some other react app already running on port 8080 so you have to stop it
OR
you have to change your current app port to some other port.

Related

a complete log of this run can be found in npm run dev - ubuntu

Good morning, I am trying to make a deployment of a page developed in vue.js and I uploaded all the files and it works, I just need to run "npm run dev" but it throws me the following error. I already ran "npm install" delete package.json and the node_modules folders I ran everything from scratch again but it remains the same
> # dev /var/www/html
> npm run development
> # development /var/www/html
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js
21% building 95/96 modules 1 active .../dist/cjs.js??ref--5-5!/var/www/html/resources/sass/app.scssnpm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! # development: `cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the # development 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! /root/.npm/_logs/2021-01-08T16_00_32_214Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! # dev: `npm run development`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the # dev 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! /root/.npm/_logs/2021-01-08T16_00_32_256Z-debug.log
Try to below way i hope it work
1. cmd -> npm cache clean
2. delete package.lock.json file
3. delete node module folder
4. cmd -> npm install

NPM scripts permission denied on chronos (chromebook shell)

I recently installed node on my chromebook. I have git cloned a basic node repo that is trying to run things like webpack, babel-node, and concurrently through npm scripts.
However, running webpack (in the same directory) works just fine.
I have run "sudo chmod -R 777 my_app" and it did not help.
Here is the error message:
chronos#localhost ~/Downloads/MODULE $ npm start
> my-glitch-app#0.0.1 start /home/chronos/user/Downloads/MODULE
> concurrently "webpack -w -p" "babel-node server.js"
sh: concurrently: Permission denied
npm ERR! Linux 3.18.0-14875-g438cb8ab27c6
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "start"
npm ERR! node v6.11.0
npm ERR! npm v3.10.10
npm ERR! code ELIFECYCLE
npm ERR! my-glitch-app#0.0.1 start: `concurrently "webpack -w -p" "babel-node server.js"`
npm ERR! Exit status 126
npm ERR!
npm ERR! Failed at the my-glitch-app#0.0.1 start script 'concurrently "webpack -w -p" "babel-node server.js"'.
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 my-glitch-app package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! concurrently "webpack -w -p" "babel-node server.js"
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs my-glitch-app
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls my-glitch-app
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR! /home/chronos/user/Downloads/MODULE/npm-debug.log
following my comment above, sudo mount -o remount,exec /home/chronos/user seemed to work, but i have further anomalies in my case, so i'd be curious about peer experience

Getting error laravel 5.4 vue js setup?

I run the command npm install.
After that running command npm run watch but giving following error in Ubuntu 16.04 terminal.
> # dev /var/www/html/lara-vue
> npm run development
> # development /var/www/html/lara-vue
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
/var/www/html/lara-vue/node_modules/laravel-mix/setup/webpack.config.js:1 (function (exports, require, module, __filename, __dirname) { let path
= require('path');
^^^
SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode
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 Module.require (module.js:354:17)
at require (internal/module.js:12:17)
at requireConfig (/var/www/html/lara-vue/node_modules/webpack/bin/convert-argv.js:96:18)
at /var/www/html/lara-vue/node_modules/webpack/bin/convert-argv.js:109:17
at Array.forEach (native)
npm ERR! Linux 4.8.0-58-generic npm ERR! argv "/usr/bin/nodejs" "/usr/bin/npm" "run" "development" npm ERR! node v4.2.6 npm ERR! npm v3.5.2 npm ERR! code ELIFECYCLE npm ERR! # development: `cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress
--hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the # development script 'cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js
--progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js'. 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 package, npm ERR! not with npm itself. npm ERR! Tell the author that this fails on your system: npm ERR! cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules
--config=node_modules/laravel-mix/setup/webpack.config.js npm ERR! You can get information on how to open an issue for this project with: npm ERR! npm bugs npm ERR! Or if that isn't available, you can get their info via: npm ERR! npm owner ls npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request: npm ERR! /var/www/html/lara-vue/npm-debug.log
npm ERR! Linux 4.8.0-58-generic npm ERR! argv "/usr/bin/nodejs" "/usr/bin/npm" "run" "dev" npm ERR! node v4.2.6 npm ERR! npm v3.5.2 npm ERR! code ELIFECYCLE npm ERR! # dev: `npm run development` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the # dev script 'npm run development'. 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 package, npm ERR! not with npm itself. npm ERR! Tell the author that this fails on your system: npm ERR! npm run development npm ERR! You can get information on how to open an issue for this project with: npm ERR! npm bugs npm ERR! Or if that isn't available, you can get their info via: npm ERR! npm owner ls npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request: npm ERR! /var/www/html/lara-vue/npm-debug.log

resolve failed: { Error: Cannot find module 'npm-watch'

When I run "npm install", it runs successfully and it installs all the packages in node_module folder. However when I run "npm start" command in cmd then it gives following errors.
D:\INSM-HTML-Player>npm start
insm-player#1.0.0 start D:\INSM-HTML-Player
npm run build && npm run serve | npm run watch
insm-player#1.0.0 build D:\INSM-HTML-Player
rollup -c && concat-cli -f dist/main.js -o dist/all.js && npm run compress
resolve failed: { Error: Cannot find module 'npm-watch'
at Function.Module._resolveFilename (module.js:469:15)
at Function.requireRelative.resolve (D:\INSM-HTML-Player\node_modules\requir e-relative\index.js:30:17)
at resolve (D:\INSM-HTML-Player\node_modules\modify-babel-preset\lib\seriali ze.js:25:26)
at findAndRemove (D:\INSM-HTML-Player\node_modules\modify-babel-preset\lib\s erialize.js:67:11)
at D:\INSM-HTML-Player\node_modules\modify-babel-preset\lib\serialize.js:111:13 at Array.map (native)
at loadPreset (D:\INSM-HTML-Player\node_modules\modify-babel-preset\lib\serialize.js:103:29)
at module.exports (D:\INSM-HTML-Player\node_modules\modify-babel-preset\inde x.js:97:19)
at Object.<anonymous> (D:\INSM-HTML-Player\node_modules\babel-preset-es2015-rollup\index.js:3:18)
at Module._compile (module.js:570:32) code: 'MODULE_NOT_FOUND' } npm-watch resolve failed: { Error: Cannot find module 'grunt-cli'
at Function.Module._resolveFilename (module.js:469:15)
at Function.requireRelative.resolve (D:\INSM-HTML-Player\node_modules\requir e-relative\index.js:30:17)
at resolve (D:\INSM-HTML-Player\node_modules\modify-babel-preset\lib\seriali ze.js:25: at findAndRemove (D:\INSM-HTML-Player\node_modules\modify-babel-preset\lib\s erialize.js:67:11)
at D:\INSM-HTML-Player\node_modules\modify-babel-preset\lib\serialize.js:111:13
at Array.map (native)
at loadPreset (D:\INSM-HTML-Player\node_modules\modify-babel-preset\lib\serialize.js:103:29)
at module.exports (D:\INSM-HTML-Player\node_modules\modify-babel-preset\index.js:97:19)
at Object.<anonymous> (D:\INSM-HTML-Player\node_modules\babel-preset-es2015-rollup\index.js:3:18)
at Module._compile (module.js:570:32) code: 'MODULE_NOT_FOUND' } gruntcli C:\Program Files\nodejs\node.exe D:\INSM-HTML-Player\node_modules\rollup\bin\rollup concat-cli -f string -o string
Options: -f, --files files or glob/wildcard to be matched and concatenated
[array] [required]
-o, --output the resulting file of the concatenation[string] [default: "all"]
--helpShow help [boolean]Examples: concat-cli -f *.js -o bundle.js This will concatenate all the js files in the current directory into a bundle.js Missing required argument: f
npm ERR! Windows_NT 6.1.7601
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe""C:\\ProgramFiles\\nodejs\\node_modules\\npm\\bin\\npm cli.js" "run" "build"
npm ERR! node v6.9.4
npm ERR! npm v3.10.10
npm ERR! code ELIFECYCLE
npm ERR! insm-player#1.0.0 build: `rollup -c && concat-cli -f dist/main.js o dist/all.js && npm run compress`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the insm-player#1.0.0 build script 'rollup -c && concat cli - f dist/main.js -o dist/all.js && npm run compress'.
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 insm-player package,
npm ERR! not with npm itself. npm ERR! Tell
the author that this fails on your system:
npm ERR! rollup -c &&
concat-cli -f dist/main.js -o dist/all.js && npm run c ompress npm
ERR! You can get information on how to open an issue for this project
with:
npm ERR! npm bugs insm-player npm ERR! Or if that isn't
available, you can get their info via: npm ERR! npm owner ls
insm-player
npm ERR! There is likely additional logging output
above.
npm ERR! Please include the following file with any support request:
npm ERR! D:\INSM-HTML-Player\npm-debug.log
npm ERR! Windows_NT 6.1.7601
npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\ node_modules\\npm\\bin\\npm-cli.js" "start" npm
ERR! node v6.9.4 npm ERR! npm v3.10.10 npm ERR! code ELIFECYCLE
npm ERR! insm-player#1.0.0 start: `npm run build && npm run serve |
npm run watch`
npm ERR! Exit status 1 npm ERR! npm ERR! Failed
at the insm-player#1.0.0 start script 'npm run build && npm run
serve | npm run watch'.
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 insm-player package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! npm run build && npm run serve | npm run watch
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs insm-player
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls insm-player
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR! D:\INSM-HTML-Player\npm-debug.log
You have to add the missing package npm-watch to package.json:
npm install npm-watch --save-dev
The run npm start again.

Yeoman Javascript error involving 'mkdir'

I'm setting up a Meanjs instance with a Yeoman generator. When I do 'sudo yo meanjs' everything works fine until it looks like it is trying to make a directory and it fails, any ideas on what is going on here?
SOLINK_MODULE(target) Release/kerberos.node: Finished
> bson#0.2.5 install /Users/xxx/Documents/mean/node_modules/connect-
mongo/node_modules/mongodb/node_modules/bson
> (node-gyp rebuild 2> builderror.log) || (exit 0)
CXX(target) Release/obj.target/bson/ext/bson.o
SOLINK_MODULE(target) Release/bson.node
SOLINK_MODULE(target) Release/bson.node: Finished
npm ERR! Error: EACCES, mkdir '/Users/xxx/.npm/uglify-js/2.4.15'
npm ERR! { [Error: EACCES, mkdir '/Users/xxx/.npm/uglify-js/2.4.15']
npm ERR! errno: 3,
npm ERR! code: 'EACCES',
npm ERR! path: '/Users/xxx/.npm/uglify-js/2.4.15',
npm ERR! parent: 'grunt-contrib-uglify' }
npm ERR!
npm ERR! Please try running this command again as root/Administrator.
npm ERR! System Darwin 13.4.0
npm ERR! command "node" "/usr/local/bin/npm" "install"
npm ERR! cwd /Users/xxx/Documents/mean
npm ERR! node -v v0.10.33
npm ERR! npm -v 1.4.28
npm ERR! path /Users/xxx/.npm/uglify-js/2.4.15
npm ERR! code EACCES
npm ERR! errno 3
npm ERR! stack Error: EACCES, mkdir '/Users/xxx/.npm/uglify-js/2.4.15'
npm ERR! not ok code 0
That is a pretty common error.
Yeoman is running the following:
bower install & npm install
Bower install succeeded, however NPM install is failing because of user permissions. Just run:
sudo npm install
The ZenCoder's answer is spot on, but if you want to permanently fix this permissions error, you can follow the tutorial at: https://docs.npmjs.com/getting-started/fixing-npm-permissions
Since you're on a Mac, you could actually avoid npm permissions errors altogether by just installing node instead via homebrew:
brew install node (this will install npm too)
Homebrew installs programs to a directory that doesn't require sudo for write, so you can npm install -g <whatever> freely without it.

Categories

Resources