Yarn removes folder within installed dependency - npm

I am using Yarn v0.19.1 to install some dependencies. I deleted my node_modules folder completely and did a fresh yarn install.
I am trying to install the dependency leaflet using yarn add leaflet. The module installs successfully, except during the Cleaning Modules... phase, Yarn removes the images folder which would typically live within leaflet/dist/images. When I do a npm install leaflet this folder does not get removed.
During a yarn install, the images folder is present until the Cleaning modules phase happens.
Who/what is doing this? Is this something yarn does? Or is this something specified within the leaflet library? How could I resolve this?
I checked the package.json in the leaflet library and nothing seemed out of the ordinary there. It runs a jake file, but even within that file nothing is being deleted related to images.
Here is what the folder looks like, within my node_modules folder, for both package manager installs:
yarn
npm

There was a .yarnclean file in my project. This added some files/folders to ignore when installing dependencies. Running yarn clean added this file and I wasn't aware until I saw this issue. Viewing the docs also gave the same info.
I resolved this by removing images from the set of ignored directories.
Here is my .yarnclean file for an example:
# test directories
__tests__
test
tests
powered-test
# asset directories
docs
doc
website
assets
# examples
example
examples
# code coverage directories
coverage
.nyc_output
# build scripts
Makefile
Gulpfile.js
Gruntfile.js
# configs
.tern-project
.gitattributes
.editorconfig
.*ignore
.eslintrc
.jshintrc
.flowconfig
.documentup.json
.yarn-metadata.json
# misc
*.gz
*.md

Related

How do I use a local plugin with ParcelJS

I use ParcelJS to bundle my JavaScript code. I want to modify an existing plugin (say the Elm plugin) to convert some special files on the fly with our own proprietary transpiler to JavaScript.
Therefor I cannot install the plugin from teh npmjs repo via Yarn into the node_modules folder. I have the relevant plugin files (asset.js, index.js, package.json) in a local directory myplugin. How do I tell ParcelJS to use them?
If you have your plugin with a package.json in the directory myplugin you can add add it (as a dev dependency) with the following command:
yarn add ./myplugin --dev
Yarn will copy the plugin to the node_modules folder. When you have changed stuff in your plugin folder increase the version number in the plugin's package.json and run yarn upgrade.

How to avoid adding package to node_modules if it placed locally

I have repository with app and modules. Modules includes in app by package.json like:
"application-module": "file:../modules/application-module"
After yarn install that dependency added to node_modules.
I want to make module-base application. app folder reproduce root module. Other modules like admin-panel-module, account-module should be in modules folder. So, app may have node_modules inside, but also modules folder for modules. Those modules will add by git subtree from another repos. So, this way I can develop independently
Is any way to avoid adding and use local directories?
Multiple node_modules and package.json
In any node/npm project, you can have multiple package.json across your directory tree, like:
app/
package.json
node_modules
src...
account_module/
package.json
node_modules
src...
admin_module/
package.json
node_modules
src..
When you invoke yarn (or npm install ofc) on any of the children modules, the dependencies listed in their local package.json will be installed on the local node_modules folder.
So basically you can solve your issue ensuring that every children has their own package.json with their dependencies.
Still, you can place common dependencies in the root app folder. If all your projects for instance use lodash, you can place the lodash dependency in the add's package_json. After performing yarn in the app folder, the lodash package will be installed in the app's node_modules.
After that, if you:
require('lodash');
In any of the children, they will search for lodash in the app's node_modules folder if they don't find lodash in their own node_modules.
If you don't have a root node_modules, you can still declare a package.json local to any of the submodules, and they'll have their own node_modules.
So maybe you may want to avoid common dependencies at all, or maybe you want to store common dependencies in the app folder. Npm has you covered either ways.
However, if you don't want to handle common dependencies, yet are concerned about having to store a lot of duplicated packages in local machines, you may want to checkout pnpm, which is a wrapper over npm which allows to save a lot of space in local development machines.
I'm having (almost) the same issue with yarn.
I have create a package (typescript) called "test". In this package, after built, there are mainly 3 directories : dist (after built), node_modules and src.
Then I have created another package "test2" and in this package, have added "test" as a dependency "yarn add c:/.../.../test".
The package is the well installed in the node_module of test2. BUT, in "test2/node_modules/test", I can find the node_modules of test ( "test2/node_modules/test/node_modules". Why ? It increases the size of the package a lot.
In both tsconfig.json (test and test2) node_modules is excluded...
thks

Angular 5: Is it possible to link a local npm module?

I have a custom node module, that I can't publish on NPM.
I'd like to use it as any module I have on NPM.
Is it possible without the awful thing of copying the folder into the node_modules?
The answer is: YES, IT's POSSIBLE.
Let's assume your module has a dist folder, with the built source
(for example I run gulp on my src folder and procude the dist folder).
you simply got to run npm pack ./dist in your library.
this will produce a tgz archive with your library named your-library-version
then you can install your module in your project by simply running
npm i path-to/your-library-version.tgz
And you're done.
Let's say my library fodler is C:\ngx-mat-lib
so my tgz will be in this folder, since the dist folder should be a child of ngx-mat-lib.
In my project I'll run
npm i C:/ngx-mat-lib/ngx-mat-lib-0.0.1.tgz
Note: using forward slashes to avoid doubling them

Forking and changing an NPM package

I have been using an NPM for angular-4 which support drag and drop objects (ng2-drag-drop). I found a missing functionality and decide to add it to the package.
What I did is forking the original project and adding my changes. after commit/push to my git I then used the following command to install my NPM :
npm install https://github.com/..... --save
the NPM installed successfully however when looking in my node_modules I see that the source files are missing and I have only the root directory including the package.json and some other files . any source files are missing.
I then tried to instal the NPM directly from the author git so instead of running :
npm install ng2-drag-drop --save
I used
npm install https://github.com/ObaidUrRehman/ng2-drag-drop.git --save
and I had the same issue with my fork.
Why the installation is different between the author git and the named package ? isn't it taking the files from the same location ? if no, what should I do to make it work ?
The reason you are not able to see the src folder is
If you see the git repo you will find two files
gitignore & npmignore.
In that npm ignore file you will find the src has been ignored to be prevent it from being added to the package when running npm commands .
Keeping files out of your package
Use a .npmignore file to keep stuff out of your package. If there's no
.npmignore file, but there is a .gitignore file, then npm will ignore
the stuff matched by the .gitignore file. If you want to include
something that is excluded by your .gitignore file, you can create an
empty .npmignore file to override it. Like git, npm looks for
.npmignore and .gitignore files in all subdirectories of your package,
not only the root directory.
You need to overwrite these settings to be able to get src contents in node modules when you do npm install

How do setup a npm / grunt development environment properly?

I know that package.json has a dependencies section and a devDependencies section. I know package.json also has a postinstall hook. So I've currently got things setup like so:
dependencies: everything the server needs to run
devDependencies: everything I need to build the application (grunt and whatnot)
postinstall: runs "grunt build"
The grunt build take all my source jade, stylus, and javascript files and compiles/minifies them into my html, css, and app.min.js files. All these go into a ./deploy folder.
The grunt build process also copies in the server files (server.js and ./server/**/*) into the ./deploy folder. The issue is how do I go about copying in only the correct dependencies from the ./node_modules/ folder into ./deploy/node_modules and not all the devDependencies modules that aren't needed.
Is there something I can pass to npm install or put in package.json to tell it where to put the dependencies?
In the end I want to be able to zip up the ./deploy/ folder and send it off to a hosting site to run the app.