How to use concurrently in Yarn package? - npm

The default package manager in my system is Yarn. I am trying to follow a course that uses NPM. Instead of shifting to NPM, I wanted to continue in Yarn but I got stuck in concurrently. How can I convert the following code for Yarn?
"start": "node backend/server",
"server": "nodemon backend/server",
"client": "npm start --prefix frontend",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"data:import": "node backend/seeder",
"data:destroy": "node backend/seeder -d",

yarn version for above code will be:
"start": "node backend/server",
"server": "nodemon backend/server",
"client": "yarn --cwd frontend start",
"dev": "concurrently \"yarn server\" \"yarn client\"",
"data:import": "node backend/seeder",
"data:destroy": "node backend/seeder -d"
CWD - current working directory

Related

npm run dev is not working missing script how do I fix this

I have downloaded a zip file of a Barba project, unzipped opened it in VS then npm install yarn and then npm run dev.. I get error missing script dev. What am I missing ?
"name": "barba-starter-template",
"version": "1.0.0",
"description": "A simple starter template for setting up a ECMAScript 6 project with barba.js and webpack.",
"main": "app.js",
"scripts": {
"dev": "webpack-dev-server --mode development",
"build": "webpack --mode production",
"start": "node index.js"
},

how to create production SSR build with sparatcus CCV2

some of my functonality is breaking in prdo build with SSR but working fine with local SSR build.
I am not able to create the exact prod build command.
here is my dev build command
"ng": "ng",
"sonar": "sonar-scanner",
"start": "ng serve",
"start:ssl": "ng serve --ssl --disable-host-check",
"build": "node --max-http-header-size=16384 ./node_modules/#angular/cli/bin/ng build --prod",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"dev:ssr": "node --max-http-header-size=16384 ./node_modules/#angular/cli/bin/ng run mystore:serve-ssr",
"serve:ssr": "node --max-http-header-size=16384 dist/mystore/server/main.js",
"serve:dev:ssr": "node --max-http-header-size=16384 dist/mystore-server/main.js",
"build:dev:ssr": "node --max-http-header-size=16384 ./node_modules/#angular/cli/bin/ng build && node --max-http-header-size=16384 ./node_modules/#angular/cli/bin/ng run mystore:server",
"build:ssr": "(cp server.prod.ts server.ts || copy server.prod.ts server.ts) && node --max-http-header-size=16384 ./node_modules/#angular/cli/bin/ng build --prod && node --max-http-header-size=16384 ./node_modules/#angular/cli/bin/ng run mystore:server:production && mv dist/mystore-server/main.js dist/server.js || move dist\\mystore-server\\main.js dist\\server.js",
"prerender": "ng run mystore:prerender"
and the combined command I ran is
yarn build:dev:ssr & yarn serve:dev:ssr
I need how this replace Backend OCC url in the build
If you are using version 4.0, you may need to set the CX_BASE_URL as an environment variable when you build. There is an article here about the way the OCC url is handled between 3.0 and 4.0: https://chowdera.com/2021/08/20210807233507800o.html

Postcss src/tailwind.css -o src/styles.css script error

I have created my react-app and only thereafter I added tailwind.
Currently this is my folder structure:
Package.json looks like this:
"scripts": {
"start": "postcss src/tailwind.css -o src/styles.css && react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
I am unable to run my npm start script whenever I add postcss to the script and when I don't tailwind css is not applied to my project at all.
The error I am getting when I add postcss:
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! phshopper#0.1.0 start: `postcss src/tailwind.css -o src/styles.css && react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the phshopper#0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Thanks
Can you please check the below code? Hope it will work for you.
#1 You need to add postcss src/tailwind.css -o src/styles.css in "build:css" and
#2 Keep the file build command npm run build:css in "build" like below.
"scripts": {
"start": "react-scripts start",
"build": "npm run build:css && react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"build:css": "postcss src/tailwind.css -o src/styles.css",
}

Concurrently npm with React Js

I have a project which is created using Node express and React Js. The server(Node) package.json as follows. It uses concurrently to start both server and client as once using npm run dev. The server uses port 5000 and the client uses port 3000 And the Folder structure as follows.
/
|
|-mysample
|
|-client
| |-.env
| |-package.json
| |-src
|-server.js
|-package.json
package.json(mysample)
{
"name": "mysample",
"version": "1.0.0",
"description": "My Sample",
"main": "server.js",
"scripts": {
"client-install": "npm install --prefix client",
"start": "nodemon server.js",
"server": "nodemon server.js",
"client": "npm start --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\""
},
"author": "test",
"license": "ISC",
"dependencies": {
"bcryptjs": "^2.4.3",
"body-parser": "^1.18.3",
"concurrently": "^4.0.1",
"express": "^4.16.4",
"mongoose": "^5.3.8",
},
"devDependencies": {
"nodemon": "^1.18.9"
}
}
How can I use concurrently npm package to start two react js projects which uses port 3000 for admin and 8000 for client.
/
|-ebook_admin
|
|-client
| |-.env
| |-package.json
| |-src
| |-public
| |
|-package.json
|-src
|-public
|-.env
If I understand your question correctly, you can take a look at one of my projects here https://github.com/chriskavanagh/mern-shopping-list/blob/master/package.json to see how as long as you've set up a proxy here https://github.com/chriskavanagh/mern-shopping-list/blob/master/client/package.json changing the port to 8000.
This is the backend package.json
"scripts": {
"client-install": "npm install --prefix client",
"start": "node server.js",
"server": "nodemon server.js",
"client": "npm start --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client",
"test": "echo \"Error: no test specified\" && exit 1"
},
and
"proxy": "http://localhost:8000", in your client package.json
Solution is Here, first of all install concurrently(npm).
"scripts": {
"client-install": "npm install --prefix client",
"start": "nodemon server.js",
"server": "nodemon server.js",
"client": "npm start --prefix client",
"dev": "concurrently \"cd server && npm server"\ \"npm run client"\"
Than in your CLI: npm run dev
It's work! SkraJ5

jspm install github library

I'm tring to use https://github.com/intljusticemission/react-big-calendar after forking
I can jspm install -dev github:pcompassion/react-big-calendar fine.
But it's lacking lib directory, I think jspm is not running "scripts" in package.json (Is it supposed to do?)
"scripts": {
"clean": "rimraf lib",
"clean:examples": "rimraf examples/static",
"less": "lessc --autoprefix=\"ie >= 10, last 2 versions\" src/less/styles.less ./lib/css/react-big-calendar.css",
"assets": "cpy src/less/* lib/less",
"build": "npm run clean && babel src --out-dir lib && npm run assets && npm run less",
"build:examples": "npm run clean:examples && webpack --config webpack/examples.config.es6.js",
"build:visual-test": "webpack --config webpack/visual-test.es6.js",
"examples": "npm run clean:examples && webpack-dev-server --inline --hot --config webpack/examples.config.es6.js",
"lint": "eslint src --ext .jsx --ext .js",
"storybook": "start-storybook -p 9002",
"test": "npm run lint",
"tdd": "karma start",
"release": "release"
},
So I should go to the folder and mannualy do npm install ?