I'm trying to create a React project in WebStorm 2016.3.1
It's asking me for a create-react-app but I have no idea what that is and I can't find any reference on Google.
What is it and where can I find the value?
You need to install create-react-app npm module, before you use this feature.
npm install -g create-react-app
You can read more about this feature on the official release blog of WebStorm.
Excerpt from the documentation :
Make sure that you have create-react-app installed globally on your computer, for that run npm install -g create-react-app. Then to start your new project, double click on the start task in the npm tasks tool window to run it. That’s it!
I had ie installed create-react-app globally using yarn and webstorm failed to find it. Then I used npm, not to mention globally and its working like a charm.
TL;DRNo need to install anything. Just enter npx create-react-app in the create-react-app field & it should work like a pycharm, I mean charm :)
Side note: npx is pre-bundled with npm since npm version 5.2.0.
I created webStrom react app following this steps.
Download node.js
Open command line console and type "npm install -g create-react-app"
Create react app project from web-storm.
Make sure you provided the correct file path of create-react-app , by default it is
installed in ~\AppData\Roaming\npm\node_modules\create-react-app
use
npm start: to start development server
If you are using asdf or any other tool to manage multiple versions of nodejs, you will need to set up the path to create-react-app manually
I'm on mac, so for me the path was
/Users/<USER>/.asdf/installs/nodejs/12.16.2/.npm/lib/node_modules/create-react-app
Related
Months ago, on my home PC I installed nodejs, react, etc., and got various tutorial sample projects working.
Now I’m remoting to my up-to-date Windows 10 work PC to install everything.
I’ve done the setup steps from the Traversy Media React Crash Course tutorial (5 stars), also just now, to double-check, watched the 1-minute video and reviewed the simple instructions at https://www.techomoro.com/how-to-install-and-setup-a-react-app-on-windows-10/ .
So I’ve installed nodejs from https://nodejs.org/en and downloaded react-0.14.3.zip (but there’s not an .msi installer, just a build folder and an examples folder… am I forgetting or missing something?)
Installed create-react-app globally:
PS C:\users\molin\dev\myapp> npm install -g create-react-app
…which spewed out…
C:\Users\molin\AppData\Roaming\npm\create-react-app -> C:\Users\molin\AppData\Roaming\npm\node_modules\create-react-app\index.js
[+ sign] create-react-app#4.0.1 updated 1 package in 7.639s
When I’m a level above the myapp folder and do either of these:
npx create-react-app .
npx create-react-app myapp
…or if I’m in the myapp folder and do either of these:
npx create-react-app myapp
npx create-react-app .
… I get the error:
Command failed: create-react-app spawn EPERM
Per a suggestion on a board, I ran this and retried, but no joy.
npm cache clean --force
I even rebooted and tried again.
No events show on the Window Event viewer.
Is this a permissions error on my work PC?
Thank you for any advice!
Reinstall react app globally
npm i -g create-react-app
Recreate your app -
create-react-app
(maybe this will help)
Got it working, jeez. In case this helps someone...
Opened VS Code; Undoubtedly didn't need to do this, but did File >
Open the folder myapp (which contained nothing yet)
Opened the VS Code terminal, cd .. to go a level up above the myapp folder;
npx create-react-app myappNEW , IOW a folder that didn't exist yet.
If I did that last command for "myapp", it gave the spawn error.
I had typed the following, but then tried it and it failed, so this is not the case: Conceivably, when doing this from the powershell, I didn't try npx (rather than npm) with a non-existent folder name.
No need for any other package install in your PC or System.
Install node
npm i node
create project
npx create-react-app project_name --template all
Please try these commands on your terminal:-
npx create-react-app my-app
cd my-app
npm start
I hope this will help you out.
You can also visit https://reactjs.org/docs/create-a-new-react-app.html for your reference.
As title.
I'm developing a web system for customers use react.js and Ant Design.
So many items are required NPM to download.
I use Visual Studio to develop ASP.Net web systems under Windows platform, so I wonder if I can understand what is should be added into the project and what is shouldn't inside what I downloaded from NPM. Furthermore, I need to deploy my product to a test site or even to customers.
I've read Use of Ant Design Icons While Offline but I don't know what is I really needed because of my poor English. I've downloaded Ant-design-icons by NPM, but I failed to add it to my project because it make my Visual Studio busy and no response. I've tried to add the contents of the "dist" folder in the package downloaded by NPM, and I got 1 error per 1 ts file while compiling. Could I have a way to achieve it?
I recommend using create-react-app for a quickstart to react.
Simply type (in terminal. in some directory):
npx create-react-app my-app
cd my-app
npm i antd #ant-design/icons
npm start
This will initialize a new react app in a folder called my-app (you can change the name if you wish), change into that directory, install ant design and the icons package. and start the dev server.
That should be enough to be able to get started using Ant Design.
If you are having npm trouble, try yarn.
Same idea:
yarn create react-app my-app
cd my-app
yarn add antd #ant-design/icons
yarn start
I'm trying to create a new ReactJS project by typing on cmd:
create-react-app new_project
But the cmd appear like this for hours and no change:
Creating a new React app in...
My node version: v10.16.3.
My npm version: 6.12.0.
Please help me to solve this problem. Thanks.
Try
npm install npm#latest -g
and run again
Similar problem's here
create-react-app hangs when initializing an app
It seems create-react-app not installed globally properly.
Try this
npm install -g create-react-app
the restart you system.
Now try using the command you used.
create-react-app new_project
I have some code that I've written in a RN app, and I want to open-source and post it on npm for others to consume. What's the best workflow for writing a pure JS React Native library? Thanks!
So these are the steps on how to create a re-usable React Native library and publish it to NPM:
Create an account at https://npmjs.com
Open command line terminal, type:
npx create-react-native-library your-library-name-here
cd your-library-name-here
npm login
npm install --save react-native-builder-bob
npm install
npx react-native-builder-bob build
npm publish
You can verify at your https://npmjs.com home page that this library is now there. Now, to test it you have to create another React Native application, which will depend on the newly created library:
Open terminal
npx react-native init MyTestApp
cd MyTestApp
npx install --save your-library-name-here
Modify App.js main code entrypoint and make a call to a method in your library that multiplies two numbers to prove that the library works.
Open another terminal, go to project root folder and type:
npx react-native start.
From the main terminal at step#1, type:
npx react-native run-android
These steps needs a properly installed Android Studio IDE and node (Nodejs). The step to create the react-native library already has one callable pre-made test method called multiply(a, b).
If your module is pure JS, you can simply follow these steps to publish to npm:
https://docs.npmjs.com/getting-started/publishing-npm-packages
Essentially, you are exporting a component from your main file (index.js). This should all be defined in your package.json
A RN example: https://github.com/ugiacoman/react-native-calendar
I'll be publishing this package to npm soon :)
If your module requires native code, you can use this generator to setup your project:
https://github.com/frostney/react-native-create-library
I want to install Angular version 4.* on my windows 7.
I am currently using Angular version 1.6.*
I tried following command
npm install #angular/{common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router,animations}#next --save
But its not working
Can any one please guide me to install and to create angular 4 project..
Make sure you have node version above 6.9 and npm above 3
Check the version by using node --version and npm --version
Install angular cli using npm install -g #angular/cli
-g installs the angular globally on your system and you just have to run this command only once
Create the angular project using ‘ng new angularprojectname’
Go to that project folder and check the angular version by ‘ng -v’
Upgrade this version to angular 4 by running this command-
For Windows-
npm install #angular/common#next #angular/compiler#next #angular/compiler-cli#next #angular/core#next #angular/forms#next #angular/http#next #angular/platform-browser#next #angular/platform-browser-dynamic#next #angular/platform-server#next #angular/router#next #angular/animations#next --save
For Linux/Mac-
npm install #angular/{common,compiler,compiler-cli,core,forms,http,platform-browser,platform-browser-dynamic,platform-server,router,animations}#next --save
Make sure to upgrade the typescript version by running command-
npm install typescript#2.2.1 --save
Ignore whatever warning it shows up and now check the angular version by ‘ng -v’
The version has changed from 2.2.4 to 4.1.0
You can also check all the info about your angular cli in package.json file.
You just need to install npm -g install angular-cli
And write sudo if you are using mac or ubantu
Then go to directory where you want project and then ng new PROJECTNAME
It will create project
Hope it helps you
I am adding this to update the answer.
If you want to install the latest angular version others answers are for you.
If you want to install a specific version of angular (Get your version number here)
You should use the below command.
npm install -g #angular/cli#VERSION_NUMBER
for example, if you want to install angular 1.4.9 command should be like below
npm install -g #angular/cli#1.4.9
I have also found the same issue while installing.
Please Do check npm and nodejs version and upgrade them.
I'd like to recommend node v6.x.x and npm 4.x.x or higher
There are many ways to structure AngularJS applications. When you begin to upgrade these applications to Angular, some will turn out to be much more easy to work with than others. There are a few key techniques and patterns that you can apply to future proof apps even before you begin the migration.
Follow the AngularJS Style Guide
Using a Module Loader
Migrating to TypeScript
Using Component Directives
Upgrade with ngUpgrade
Or up can follow the official document of Angular
For installing Angular 4 follow below simple steps:
Install node.js and npm(they are required dependencies. npm is automatically installed on installing node.js). You can install it
from here
With the help of npm install angular CLI. Type the following command in your command prompt: npm install -g #angular/cli
If you are still facing some problems you have to install git. You can install it from here
Now to create an angular 4 project using Angular CLI type the following command:
ng new [Project_Name]
This will create an Angualr 4 project.
5.To start the server and get your project up and running type following in command line:
ng serve
Remember you should be inside the project folder before starting the server. Hope this helps.
You have some libraries, Like
angular-material, angular-cdk`
etc...
Add all those and Try.
It will work for sure.
And you will be able to run the project
Install angular cli globally.
npm install -g #angular/cli
Get git pull from repository:-
[https://github.com/blazehub/ng-cli-starter.git]
to get ready made production ready project structure.
If you are looking for latest angular version use this command to install
npm -g install #angular/cli