Background:
I have a lerna monorepo with yarn workspaces and two packages. I am using tsc as the TS compiler.
packages/module1/package.json:
"scripts": {
"watch": "tsc --watch",
"build": " tsc && tsc -m es6 --outDir ./dist/esm && webpack --config webpack.config.js",
}
packages/module2/package.json:
scripts: {
"watch": "tsc --watch",
"build": " tsc && tsc -m es6 --outDir ./dist/esm && webpack --config webpack.config.js",
}
root package.json:
"scripts": {
"build": "lerna run build",
"start:project": "lerna run start --scope=#project_name/project",
"start:project:watch": "concurrently \"yarn build && lerna run watch\" \"yarn start:project\"",
},
Expected Behavior:
yarn start:project:watch will run the build scripts and the watch scripts for each package
E.g. modifying any file in either package will rebuild the project and reload the page in the browser.
Current Behavior:
yarn start:project:watch will runs the build scripts and watch scripts for package1 only.
E.g. project is rebuilt when files in package1 are modified, but not rebuilt when package2 files are modified.
What might be going on and what could I be missing?
There are possibly 2 reasons for this to happen
you are using --scope which is specific to a single package
if you want dependent packages to be rebuilt then you should include the --include-dependents flag
However even if you fix both cases mentioned above it might still work incorrectly but Lerna and Lerna-Lite added a new lerna watch command that will help with this scenario which can be used in this way.
Watch for changes on package-1 or its dependents and run the "build" script on the scoped package and also its dependents:
$ lerna watch --scope=my-package-1 --include-dependents -- lerna run build --stream --scope=\$LERNA_PACKAGE_NAME --include-dependents
Related
When I try deploying my Firebase cloud functions I get the following error.
Desired behavior: Deploy functions successfully.
Error:
Error: There was an error reading functions/package.json:
functions/lib/index.js does not exist, can't deploy
Cloud Functions
Full log:
name#name-MacBook-Pro functions % firebase deploy
=== Deploying to 'newtiktok-21570'...
i deploying functions Running command: npm --prefix "$RESOURCE_DIR"
run lint
functions# lint /Users/name/Desktop/Yoveo/functions
eslint "src/**/*"
/Users/name/Desktop/Yoveo/functions/src/index.ts
186:67 warning 'timestamp' is defined but never used
#typescript-eslint/no-unused-vars 377:86 warning 'mediaNum' is
defined but never used #typescript-eslint/no-unused-vars 377:104
warning 'commentText' is defined but never used
#typescript-eslint/no-unused-vars 377:125 warning 'commentID' is
defined but never used #typescript-eslint/no-unused-vars 419:119
warning 'commentID' is defined but never used
#typescript-eslint/no-unused-vars 463:121 warning 'commentID' is
defined but never used #typescript-eslint/no-unused-vars 520:75
warning 'mediaNum' is defined but never used
#typescript-eslint/no-unused-vars 732:25 warning 'slap' is
defined but never used #typescript-eslint/no-unused-vars
✖ 8 problems (0 errors, 8 warnings)
Running command: npm --prefix "$RESOURCE_DIR" run build ✔ functions:
Finished running predeploy script.
Error: There was an error reading functions/package.json:
My p.json:
{
"name": "functions",
"scripts": {
"lint": "eslint \"src/**/*\"",
"build": "",
"serve": "npm run build && firebase emulators:start --only functions",
"shell": "npm run build && firebase functions:shell",
"start": "npm run shell",
"deploy": "firebase deploy --only functions",
"logs": "firebase functions:log"
},
"engines": {
"node": "12"
},
"main": "lib/index.js",
"dependencies": {
"firebase-admin": "^9.2.0",
"firebase-functions": "^3.11.0"
},
"devDependencies": {
"#typescript-eslint/eslint-plugin": "^4.8.1",
"#typescript-eslint/parser": "^4.8.1",
"eslint": "^7.14.0",
"eslint-plugin-import": "^2.22.0",
"firebase-functions-test": "^0.2.0",
"typescript": "^3.8.0"
},
"private": true
}
cd into your functions folder and run this command
npm run-script build
This will create the lib/index.js file that is missing
firebase uses main field in package.json as program entry point,
set it properly, probably like this.
"main": "lib/src/index.js",
For some reason recently the build flow of firebase functions changed.
It used to be:
npm --prefix ./functions install ./functions
firebase deploy --only functions
now it is:
npm --prefix ./functions install ./functions
npm --prefix ./functions run build
firebase deploy --only functions
I have not researched what caused this change, but adding this as build step fixed the problem for me.
functions/lib/index.js does not exist
In case you are working in firebase project that contains a frontend or is structured as a monorepo, this error may also stem from having accidentally imported a frontend file in the functions backend part of the project. For all files that are not within your functions project scope, the typescript compiler will refuse to compile ts files referencing them. So in this case, the solution is to search for any imports containing /src/ (or any other paths pointing outside) and remove (or correct) them within your functions project.
you just have to change the main inside package.json file from lib/index.js to your index file which is usually under the src folder
Solved:
I was able to solve the problem by removing everything associated with Firebase functions. And running: firebase init again. After I cd functions run npm install. Then I was able to deploy successfully after fixing an error with:
3:26 error 'express' should be listed in the project's dependencies. Run 'npm i -S express' to add it import/no-extraneous-dependencies
Changing the firebase.json file to the following fixed my issue:
{
"functions": {
"predeploy": ["npm --prefix ./functions run build"],
"source": "functions"
}
}
I was able to fix this same issue by following Felix K indications, answered on Apr 28, 2021.
In case you are working in firebase project that contains a frontend or is structured as a monorepo, this error may also stem from having accidentally imported a frontend file in the functions backend part of the project. For all files that are not within your functions project scope, the typescript compiler will refuse to compile ts files referencing them. So in this case, the solution is to search for any imports containing /src/ (or any other paths pointing outside) and remove (or correct) them within your functions project.
In my case, I've accidently imported an interface from the frontend. When updating this import I was able to successfully deploy my function.
Solution from Edward Amoah Idun:
cd into your functions folder and run this command
npm run-script build
This will create the lib/index.js file that is missing
Yes, but it will create the index.js file that is missing in the wrong folder. Still necessary to check that you don't have imports from another projects.
The lib folder is for your built functions code, so you haven't built it. This can be done automatically by adding redeploy code to your firebase.json config file:
{
"functions": [
{
"predeploy": ["npm --prefix \"$RESOURCE_DIR\" run build"],
// rest of config...
}
]
}
yarn start leads to an error saying command "start" not found. In my package.json file there is no script's tag, could that be the issue. Please suggest a fix.
I am trying to install react, the commands being:
npm install -g create-react-app#1.5.2
create-react-app confusion
yarn start
cmd error:
command prompt
package.json:
"name": "confusion",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.1"
}
}
npm uninstall -g create-react-app // uninstall the old create-react-app version (in your case, v1.5.2) to make sure npx uses the latest version in Step 2
npx create-react-app my-react-app-name // npx installs the latest version of create-react-app without requiring a global install. it is included with npm, so no need to install it. if you wish, replace my-react-app-name with whatever you want your project to be called
cd my-react-app-name
yarn start
I've seen a lot of package.json files where there are scripts that doesn't do anything but call a dependency with the same name. For example :
{
"scripts": {
"lint": "npm run tslint \"src/**/*.ts\"",
"tslint": "tslint"
},
"devDependencies": {
"tslint": "~4.4.2",
"tslint-loader": "^3.3.0"
}
}
Here we have the script tslint that just calls the dependency tslint. I guess that is some kind of a way to make the lint script shorter but how would it look like if there was no script called tslint.
I don't believe NPM has this kind of functionality built in. Yarn (the third-party NPM client built by Facebook, Google, Exponent and Tilde) on the other hand, does - you can just use yarn run and it will pick up the executable from your dependencies, even if you don't have a script for it defined in your package.json:
yarn run tslint
yarn run tslint "src/**/*.ts"
I'm trying to figure out a way to make polyserve / polymer-cli to reload my browser each time a "watched" file changes but I haven't found anything apart of adding Livereload to the HTMLs files that I think is going to be a mess due that when developing web components I load separate HTML files.
For auto reloading using Polymer CLI as a server in your project you should have node / yarn installed. Then you need to install browser-sync locally.
npm install -D browser-sync
or
yarn add browser-sync --dev
Your package.json file will need to look something like:
{
"name": "MY-ELEMENT",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"scripts": {
"start": "npm run serve | npm run watch",
"serve": "polymer serve --port 8080",
"test": "polymer test",
"watch": "browser-sync start --proxy localhost:8080 --open --startPath \"components/MY-ELEMENT\" --files \"**/*.html\""
},
"devDependencies": {
"browser-sync": "^2.18.13"
}
}
(If its a regular Polymer app you should remove the --startPath argument as that is for Polymer component development)
I'm using polyserve-watch which watches, serves and reloads webcomponents using polyserve and browser-sync``.
Best regards
I updated npm installed node express,even though it is not creating the jason file. can any one please let me know how to fix this.
ramesh#ramesh-PC MINGW32 ~
$ npm init
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sane defaults.
See npm help json for definitive documentation on these fields
and exactly what they do.
Use npm install <pkg> --save afterwards to install a package and
save it as a dependency in the package.json file.
Press ^C at any time to quit.
name: (ramesh)
ramesh#ramesh-PC MINGW32 ~
First initialize your project. Assuming your project lives in directory "sample" then:
cd sample
npm init // This will ask a bunch of questions. you can mostly just hit "enter". it will create the package.json file for you
npm i express --save
using npm init you can create package.json
To clarify a bit on the previous answers, npm install <package-name> and npm install <package-name> --save may fail if you try to run them from a directory that does not have an npm package.json file.
You might type something like npm install crud --save and get some confusing output like this:
npm install crud
npm WARN saveError ENOENT: no such file or directory, open '/Users/youruser/package.json'
npm WARN enoent ENOENT: no such file or directory, open '/Users/youruser/package.json'
npm WARN youruser No description
npm WARN youruser No repository field.
npm WARN youruser No README data
npm WARN youruser No license field.
+ crud#0.0.28
That's not a very helpful error message -- the level is only "warn", and that last line makes it appear that the requested package got installed somewhere. But if you look in your directory, you will see it remains empty. The explanation of this "riddle" is that some package installers (like PHP's composer) will initialize a project and download the package, others (like Python's pip or npm) do not, so you have to initialize the directory and install packages separately.
Run npm init and answer some basic questions about your project, or copy a viable package.json file that follows the format below:
{
"name": "my-great-node-project",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
}
}
Be careful with the package name! The name cannot match the name of a package you trying to install.
Once the directory has been initialize, you should be able to run your npm install <package-name> --save command and have the package installed into the node_modules directory and have your package.json file updated.
Try not to make any space between words in your project folder name. For instance, instead of "My Portfolio" write it like "MyPortfolio". This worked for me and created json file automatically in my project folder.