An ejected project cannot use the build command anymore - angularjs

I am new in Angular. I accidentally ejected my project using command-line, i don't remember which command i used. but when i try to run command
ng serve --open
it throws me an error of
An ejected project cannot use the build command anymore.
I also re-installed angular-cli as said in this Stackoverflow Question but no use.
Can anyone help me with this?

open the angular-cli.json, you should see this at the top
"project": {
"name": "proj-name",
"ejected": true,
}
remove the ejected part and it should work

once you ejected the project you will get a webpack.config file
And also you can see some commands in package.json script tag
"scripts": {
"ng": "ng",
"start": "webpack-dev-server --port=4200",
"build": "webpack",
"test": "karma start ./karma.conf.js",
"lint": "ng lint",
"e2e": "protractor ./protractor.conf.js",
"pree2e": "webdriver-manager update --standalone false --gecko false --quiet"
},
you can still run the project by using npm start
you can still build the project by using npm run build

Related

I have downloaded the ethereum blockchain project build in react,solidity,truffle

Now It doesn't run on my ubuntu machine. When I run the npm start command it says missing script start. Is there any method to run the downloaded project?
In your package.json file, check scripts property:
"scripts": {
"clean": "rimraf build/*",
"copy-assets": "ts-node src/tools/copyAssets",
"tsc": " tsc",
"build": "npm-run-all clean tsc copy-assets",
"dev": "nodemon --watch src -e ts,ejs,css --exec npm run dev:start",
"dev:start": "npm-run-all build start",
},
Looks like start script does not exist. Instead run the appropriate one from the scripts section.

How to create a package.json script that runs a file from node_modules?

I have installed the react-clear-cache package and in the docs it says that I need to add a new script to my package.json.
This is my package.json scripts:
"scripts": {
"start": "node scripts/start.js",
"build": "node scripts/build.js",
"prebuild": "npm run generate-build-meta",
"generate-build-meta": "./node_modules/react-clear-cache/bin/cli.js"
},
According to the docs I need to run npm run generate-build-meta but everytime I try, node tells me that it wasnt able to find "./node_modules/react-clear-cache/bin/cli.js"
What I should do to correctly run this cli.js?
By the way, I have the react-clear-cache in my node_modules and I can see the cli.js
This is the message I receive:
It is pretty much saying that '.' is not recognized as an internal command.
"scripts": {
"start": "node scripts/start.js",
"build": "node scripts/build.js",
"prebuild": "npm run generate-build-meta",
"generate-build-meta": "react-clear-cache"
},
Accessing node_modules binaries by path is unnecessary in package.json scripts. Within the package.json, you can proceed as though node_modules/**/bin/ is in your $PATH.

Deploying React App from Codesandbox to Github Pages

I followed this youtube tutorial to deploy my react app to github pages. I made my react app in codesandbox and exported my sandbox to my github. I downloaded node.js, npm, and git.
My folder structure:
Users > test > package-lock.json + andair-master > (inside andair-master) node_modules + build > (inside build) public + src + package.json
I downloaded my github project "andair-master" and copied and pasted its contents into an empty folder "test".
I opened Git Bash and changed directories until I was in "andair-master". I did "git init" then "git remote add origin https://github.com/develijahlee/andair.git" then I tried "npm run deploy". I realized I was missing a "build" folder so I made one within the "andair-master" folder. Then I put my "src" and "public" folders inside the "build" folder and tried running "npm run deploy". Still not working. I notice that my github is missing a gh-pages branch. I am not sure how to make a gh-pages branch or why "npm run deploy" is not working. If anyone could tell me if I'm missing a step, that would be greatly apprecitated. Thank you.
There are a few missing dependencies in your create-react-app project. This probably happened because you tried to export the project from codesandbox (I'm not sure though)
You have to fix those first.
Dependency 1 (react-scripts):
npm install react-scripts --save-dev
Dependency 2 (node-sass because you are using scss in your project)
npm install node-sass --save
Dependency 3 (gh-pages)
npm install gh-pages --save-dev
After the above steps are completed, verify your package.json to match below structure
{
"name": "and-air",
"version": "1.0.0",
"description": "",
"keywords": [],
"main": "src/index.js",
"homepage": "https://develijahlee.github.io/andair/",
"dependencies": {
"#fortawesome/fontawesome-svg-core": "1.2.25",
"#fortawesome/free-regular-svg-icons": "5.11.2",
"#fortawesome/react-fontawesome": "0.1.5",
"node-sass": "^4.13.0",
"react": "16.9.0",
"react-dom": "16.8.6"
},
"devDependencies": {
"gh-pages": "^2.1.1",
"react-scripts": "^3.2.0",
"typescript": "3.3.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}
Now you can run the deploy script
npm run deploy
After this step, verify that a new branch created with name gh-pages
Click on the settings tab in github
Scroll down to the GitHub Pages section and switch your branch to gh-pages branch.
You should get a success message when the page is live.
Here is what deploy script in your code:
"deploy": "gh-pages -d build"
Which is means gh-pages tool use build directory to make it deploy, so you need two things in order to make it work
Create a build folder properly with the following command:
npm run build
now install gh-pages tool for your add locally:
npm i gh-pages
Now you can run deploy command, and it'll work.
I hope this can be helpful to you.

How to setup new reactjs project on local environment or system?

I started to learn reactjs for front end in web development. For learning purpose I install node and npm on my local system below are the versions of node and npm
node v8.11.3
npm v5.6.0
and I have run bellow command
npm init
and create pakage.json following file using command
{
"name": "loginpage",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^15.4.2",
"react-dom": "^15.4.2"
},
"devDependencies": {
"react-scripts": "0.9.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"main": "index.js",
"author": "rizwan",
"license": "ISC",
"description": ""
}
in next step i run following command install node and react dependencies
npm install
and then I run create-react-app hello-world commands but I did't find any change in my current local project folder exception pakage.json file I don't know that where I am doing mistake. Guide in right direction.
Create-react-app creates everything from scratch, you don't need to create a folder or npm init, anything like that.
Just run create-react-app my-project and you'll have everything you need in the my-project folder.
To create react app
first, install create-react-app globally
then, run these commands
create-react-app app-name
cd app-name
npm run start
I prefer to use Yarn instead of npm

understanding npm script (webpack-dev-server)

I have a question about npm run.
('npm run dev' is from https://github.com/vuejs/vue-hackernews/blob/gh-pages/package.json)
{
"name": "vue-hackernews",
"version": "1.0.0",
"description": "HN clone with Vue.js using HN API",
"scripts": {
"dev": "webpack-dev-server --inline --hot --no-info",
"build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
....
},
why does 'npm run dev' go well,
but does other commands like 'npm run webpack-dev-server'
or just 'webpack-dev-server' throw errors?
what does 'npm run' do? not just executing the value of the property of "scripts"?
( which I was thinking 'command exactly same thing')
thank you!
just 'webpack-dev-server' throw errors?
because in order for it to work, webpack-dev-server has to be added to the PATH environment variable. If you use npm run script-name, then:
In addition to the shell's pre-existing PATH, npm run adds
node_modules/.bin to the PATH provided to scripts.
check node_modules/.bin folder, you'll see webpack-dev-server there, and this executable runs the js package like this:
node "$basedir/../webpack-dev-server/bin/webpack-dev-server.js" "$#"
Another alternative is this if you're on Unix based env:
$(npm bin)/webpack-dev-server'

Resources