Bamboo build fails because webpack donesn't find node_modules - npm

I have configured my project on angular 1.7 with webpack. In local when I run the task npm run build (launchin webpack) everything goes correctly.
But I have a plan for my CI bamboo and when a run the NPM task with npm run build I got a message, which said:
Error: Cannot find module './yargs'
I have the intuition that webpack is not able to reach the node_modules or is not in current directory.
But node_modules is installed and yargs is there after making the npm install task before.
if I run a script before the npm run build with just "ls -l" command I get:
node_modules
package-lock.json
package.json
src
webpack.config.js
So the folder is there.
Any idea where I can take a look?

I found the solution for the issue. In the Source code checkout configuration the "Force clean build" has been checked and now the build succed.
I'm not sure why, but there must have been a conflict with a previous node_modules.

The spelling of the file that you're referring is case-sensitive when building via bamboo
building locally wouldn't give you any error nor warnings in the console.
I encountered this issue with a local file (not a node_module)... Hoping this would help someone in the future;

Related

Is there a way to only run npm scripts for installed packages (opposite of --ignore-scripts)

I am in a situation where I need to ship node_modules with the rest of my code because the destination machines do not have access to our private network (and our private npm repository).
My problem is that I want to execute everything that happens after npm downloads all the files so that individual packages can build themselves correctly for the target machine. Is there a way to accomplish this? Here are a couple other ways to phrase this question:
How can I run npm install, but skip the download step?
How can I run postinstall for installed node_modules only?
I finally got it figured it out. There were a couple of important steps to make this happen:
When we get ready to package our code for distribution, we download all of the npm dependencies with the --ignore-scripts and --no-bin-links option. This prevents any packages from building/compiling or linking any bin files. This is effectively only downloading the node_modules.
npm install --omit=dev --ignore-scripts --no-bin-links
We then distribute our code to the target machine and run the following command so that any compilations and bin links happen on the target machine:
npm rebuild

Patching a NPM package locally with patch-package, not working

I'm working on a vue.js frontend, and I need to patch a package to fit the special needs of the app. The package I'm trying to patch is 'vue-youtube' (not that it really matters). I'm trying to patch it with patch-package (https://www.npmjs.com/package/patch-package)
So basically :
I edited locally the /node_modules/vue-youtube/src/vue-youtube.js to fit my needs
I did add the postinstall script in my package.json : "scripts": { "postinstall": "patch-package" }
I did npm install patch-package --save-dev
Then I ran npx patch-package vue-youtube
It did create a vue-youtube+1.4.0.patch file in a /patches folder with my modifications
BUT, my modifications are not seen. When I do npm run serve and launch my webapp, the package used is still the one not edited. I tried running npm install before, without success. When I go to the /node_modules/vue-youtube/dist/vue-youtube.js (thankfully it is a small package so it is readable), I can see that indeed my modifications have not been "compiled".
What am I missing here ? I feel like I have followed eveything in the patch-package npm page..
Thanks
EDIT : Still investigating.. few more informations/questions :
my patch name is patches/vue-youtube+1.4.0.patch
when i run npm ls vue-youtube it returns just one element : vue-youtube#1.4.0
in my package.json the dependency listed is "vue-youtube": "^1.4.0", should it be different ? should it mention that it needs to be patched ?
EDIT 2 : I realized that I am not editing the node_modules/vue-youtube/dist/vue-youtube.js, but the node_modules/vue-youtube/src/vue-youtube.
If you edit the files in the dist folder, the patch works. (however I thought patch-package would allow me to edit the files in the src folder, in readable JS...)
WORKING SOLUTION :
If you edit the files directly in the dist/ folder of the package instead of the src/ folder, the patch works fine.
Adding below npm script in package.json after patching worked for me.
scripts: {
"prepare": "patch-package",
}
The lines from yarn documentation explains about prepare
For compatibility reasons, scripts called install, postinstall, prepublish, and prepare will all be called after your package has finished installing.
After adding this script in package.json, the changes of module file in patches folder has been patched into respective node module.
I was trying to do the exact same thing with some package, let's call it "some_package". When I saw the EDIT 2 my mind just connected the dots...
To test changes locally
Modify the files in node_modules/some_package/src folder and then, go to the node_modules/some_package and run:
$ npm install
$ npm run <name of the script that generates the dist folder>
No need to run npx patch-package nor postinstall step.
I think that this approach doesn't work for all packages, it depends on how the modified package's package.json is configured. Specifically, pay attention where the browser field is pointing (in my case ./dist/some_package.js).
CAVEAT: You will have to run npm install and npm run every time you make an update to the package.
To test changes and be able to share it among team members (when the package is on Github)
Make a fork of the package you want to modify.
Make all the changes you want to your forked version of the package.
Run the following to automatically update the package.json file to make the dependency point to your forked version:
$ npm install <github's user name>/<package's name of the forked repository>#<branch name> --save-prod
For instance, if your Github's user name is "johndoe", and you forked https://github.com/aurelia/framework, and you made a branch named "mycoolbranch" containing your changes, then it would be:
$ npm install johndoe/aurelia-framework#mycoolbranch --save-prod
Note that the --save-prod flag could be replaced with --save-dev if the dependency is just for development.
Take a look at this answer, it may help.
https://stackoverflow.com/a/71153240/9981565
For me it was happening because of version mismatch between package.json intended version of package and yarn.lock / package-lock.json

ERROR: Could not find plugin "proposal-private-methods". Ensure there is an entry in ./available-plugins.js for it

When trying to run yarn dev and I am getting the following error:
Error: [BABEL] C:\Users\User\OtherFolders\src\index.js: Could not find plugin "proposal-private-methods". Ensure there is an entry in ./available-plugins.js for it.
I have "#babel/plugin-proposal-private-methods": "7.8.3" as a dependency on my package.json file. Also, the #babel/plugin-proposal-private-methods folder is present in the node_modules folder.
I had tried the following to no luck:
Adding a resolution: "#babel/compat-data": "7.10.1" to the package file
I remove the node_module folder, yarn-lock, and package-lock files before attempting to run yarn install. yarn install runs without issues
I also try $ npm i #babel/plugin-proposal-private-methods
Any ideas on what the error could be or potential solutions? Thanks in advance for any help!
Kudos to the Babel Project GitHub team to help to solve the issue. The issue solution is to change the version of #babel/preset-env from 7.8.6 to 7.8.7 or higher. The response to this ticket in GitHub is in this link.

React-Native dependencies integration issue

I'm beginner in react-native Sorry in advance if found issues in question asking.
I cloned a repository from remote server where now i've empty node_modules directory. I've "package.json" file with all dependencies list while when I run "npm install" I didn't get dependencies in node_modules directory and got number of warnings on terminal related to different files as you can see here.
delete node_modules folder.
Then try to do npm install first. it ll added node modules folder.
after that try to install dependancies..you can find necessary dependancies from json file.
ex:- npm install --save depencencyname#versionnumber
for some modules you have to link them before it use..
using react-native link dependancyname

Command invalid: run always ask to create a project

I have a project about 4 months and suddenly the aurelia's CLI commands are not working.
When I try to execute au run --watch I receive a message with options to create a new project under the path.
I have already tried to uninstall and reinstall the aurelia CLI, It's not work.
The last thing I have done was to execute a git clean -xdf
I think that could be something on my project. Someone could help me?
ANSWER
After some attempts I fixed the problem:
1) I reinstall Git and Node;
2) I have deleted all the files under the \AppData\Roaming\npm-cache path;
3) I have checked if the Git and Node were in the PATH of environment variables;
4) I run the npm install command;
Is aurelia-cli included in the devDependencies of the project and also installed globally?
First, install globally:
npm i -g aurelia-cli
Then, in the project directory, install & save to devDependencies:
npm i --save-dev aurelia-cli
You should then be able to run au in the project directory and see that the build and run commands are now available.
Note that you'll also need to install the necessary gulp dependencies required by the tasks in your project devDependencies.
EDIT: See aurelia/cli/issues/485 which confirms that installing aurelia-cli as a local dependency fixes this issue.