Make Yarn don't hoist the dependencies of the specific package - node.js

In below project, I want all dependencies of TodoList will no be hosted to node_modules in root directory of monorepo.
Below settings is not enough to reach this effect:
{
"private": true,
"workspaces": {
"packages": [ "BusinessRules", "Server", "TodoList" ],
"nohoist": [
"TodoList/**"
]
}
}
"TodoList/**/**" is not enough too.
How to make all dependencies of TodoList will be inside TodoList/node_modules?

Found the solution here.
In this case, it's required to add below JSON in TodoList/package.json:
"workspaces": {
"nohoist": ["**"]
},

Related

Vue/Node error : Rule can only have one resource source

I am brand new to Vue and Node and everything was going well with a Vue3 project I was messing around with to learn. I wanted to use scss files so installed sass-loader via npm using:
npm install sass-loader sass webpack --save-dev
And since then the app is broken, now when I try to serve I get the following error:
Error: Rule can only have one resource source (provided resource and test + include + exclude) in {
"exclude": [
null
],
"use": [
{
"loader": "C:\\pathtoapp\\node_modules\\cache-loader\\dist\\cjs.js",
"options": {
"cacheDirectory": "C:\\pathtoapp\\node_modules\\.cache\\babel-loader",
"cacheIdentifier": "43be597c"
},
"ident": "clonedRuleSet-38.use[0]"
},
{
"loader": "C:\\pathtoapp\\node_modules\\babel-loader\\lib\\index.js",
"options": "undefined",
"ident": "undefined"
}
]
}
Error: Rule can only have one resource source (provided resource and test + include + exclude) in {
"exclude": [
null
],
"use": [
{
"loader": "C:\\pathtoapp\\node_modules\\cache-loader\\dist\\cjs.js",
"options": {
"cacheDirectory": "C:\\pathtoapp\\node_modules\\.cache\\babel-loader",
"cacheIdentifier": "43be597c"
},
"ident": "clonedRuleSet-38.use[0]"
},
{
"loader": "C:\\pathtoapp\\node_modules\\babel-loader\\lib\\index.js",
"options": "undefined",
"ident": "undefined"
}
]
}
I looked up this error and most believed this to be an issue with webpack but I have uninstalled and installed again. Installed an earlier version of webpack, tried changing package.json to point to an earlier version, tried anything I can currently find on SO and now I'm completely stumped.
Any assistance on this would be much appreciated as I'd rather learn and discover how to fix the problem should I encounter it again rather than simply start a new project. Let me know any code/files I should post in an edit where required.
I ran into the same issue and I was able to resolve it by:
rm -rf node_modules
rm package-lock.json
npm install --legacy-peer-deps
Source

Configure JSON in Arkit to visualize NPM modules in Package.json

I am using the following npm package named arkit in order to create architecture diagrams of node.js projects, but I am unable to visualize npm packages (dependencies folder) in my node.js application architecture as depicted in the examples of Arkit and Vue/Nuxt TodoMVC, I tried to follow the json configuration of each of their respective arkits but either they are non-existent like in Vue or vague like in Arkit itself.
I used the config given in arkit configuration example but I end up with all dependencies of main dependencies like this. I tried the following config
{ "$schema": "https://arkit.pro/schema.json",
"excludePatterns": ["test/**", "tests/**", "**/*.test.*", "**/*.spec.*"],
"components": [
{ "type": "Dependency",
"patterns": ["node_modules/**/*.js"] },
{ "type": "Component",
"patterns": ["**/*.js", "**/*.jsx"]
}
],
"output": [
{ "path": "arkit.svg",
"groups": [ { "first": true, "components": ["Component"] },
{
"type": "Dependencies",
"components": ["Dependency"]
}
]
}
]
}
but it crashed during architecture generation, I also emailed the owner of this npm package and one other person who successfully managed to do so, but they are busy to guide me in configuring JSON of arkit.
Can I use the for-of loop in the JSON config file in order to get only those node_modules which are included in package.json as I don't want to get additional sub-dependencies of the main npm packages in the architecture representation as depicted in the link shared above!
TL;DR
I want diagrams with dependencies like these but I am getting this
I tried, adding --depth=0 in the command line "npx arkit --config test.json --depth=0" but no luck
I think arkit expects output.path to be an array - but you are passing it a string. Try using the modified config:
{
"$schema": "https://arkit.pro/schema.json",
"excludePatterns": ["test/**", "tests/**", "**/*.test.*", "**/*.spec.*"],
"components": [{
"type": "Dependency",
"patterns": ["node_modules/*"]
},
{
"type": "Component",
"patterns": ["**/*.js", "**/*.jsx"]
}
],
"output": [{
"path": ["arkit.svg"],
"groups": [{
"first": true,
"components": ["Component"]
},
{
"type": "Dependencies",
"components": ["Dependency"]
}
]
}]
}
It's working on Ubuntu as if there are more reasons to hate Windows 10. I implemented the package.json config of the authors Vue application and viola it worked like a charm. 2 months of looking for answers and trying everything on Windows, Ubuntu did the trick

How to use a reason module from local package

I’m looking for a way to use a local package (named bs-package) from my Reason React app (named ApplicationA).
bs-package has a single file within src folder called ModuleA.re :
let greet_me = (me) => Js.log("Hello, " ++ me ++ "!");
In ApplicationA I did :
npm install /path/to/bs-package
In node_modules bs-package now appears as symbolic link.
Then added bs-package to bs-dependencies in bsconfig
"bs-dependencies": [
"reason-react",
"bs-package",
],
Then run make world in ApplicationA
bsb -make-world
Now in my Reason React app
ModuleA.greet_me("John");
Gives me
unbound module ModuleA
What am I missing ?
EDIT
Here is the config file of bs-package
It was created with
bsb -init bs-package -theme basic-reson
bsconfig.json
{
"name": "bs-pacakge",
"version": "0.1.0",
"sources": {
"dir" : "src",
"subdirs" : true
},
"package-specs": {
"module": "commonjs",
"in-source": true
},
"suffix": ".bs.js",
"bs-dependencies": [
],
"warnings": {
"error" : "+101"
},
"namespace": true,
"refmt": 3
}
package.json
{
"name": "bs-pacakge",
"version": "0.1.0",
"scripts": {
"build": "bsb -make-world",
"start": "bsb -make-world -w",
"clean": "bsb -clean-world"
},
"keywords": [
"BuckleScript"
],
"author": "",
"license": "MIT",
"devDependencies": {
"bs-platform": "^5.0.6"
}
}
As suggested, bs-package is namespaced so this should work
BsPackage.ModuleA.greet_me("name")
But the same error appears
unbound module BsPackage
Apparently the bug came from my bs-platform version. I've just switch from version 6.2.1 to version 7.0.1 and everything works fine now (I'm on Windows).

SPFX Package always referring content or resources from localhost instead from CDN

Can someone please let me know from where I can change this configuration so that it should refer from the CDN path instead of localhost
Below is my package-solution.json
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json",
"solution": {
"name": "mega-menu-sp-fx-client-side-solution",
"id": "8f49d75c-5a49-4657-b81b-0290f239350f",
"version": "10.0.0.0",
"includeClientSideAssets": true,
"skipFeatureDeployment": true,
"isDomainIsolated": false,
"features": [
{
"title": "Application Extension - Deployment of custom action.",
"description": "Deploys a custom action with ClientSideComponentId association",
"id": "0d2345df-2a49-4ce9-ba2d-bee7ad3e7a02",
"version": "10.0.0.0",
"assets": {
"elementManifests": [
"elements.xml",
"clientsideinstance.xml"
]
}
}
]
},
"paths": {
"zippedPackage": "solution/mega-menu-sp-fx.sppkg"
}
}
Below is my write-manifest.json
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/write-manifests.schema.json",
"cdnBasePath": "https://Mytenant.sharepoint.com/sites/MyTechTheme/MenuFiles"
}
I tried to figure out whats the issue. For publishing instead of gulp package-solution --ship I had used gulp package-solution so unless and until we don't mention --ship it wont take the references for CDN
So for deploying the package in SPO we need to use gulp bundle --ship and gulp package-solution --ship
As per this thread, to load SPFx assets from a CDN or SharePoint library, set the value of "includeClientSideAssets" to false.
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json",
"solution": {
...
"includeClientSideAssets": false,
...
}
}

why npm add some property with underscore in package.json

when i perform npm install koa-compose, npm will auto add some property with underscore, What role do they have? like this:
{
"_args": [
[
"koa-compose",
"/Users/keenwon/Desktop/demo"
]
],
"_from": "koa-compose#latest",
"_id": "koa-compose#2.4.0",
"_inCache": true,
"_installable": true,
"_location": "/koa-compose",
"_nodeVersion": "5.7.0",
"_npmVersion": "3.7.5",
"_phantomChildren": {},
"_spec": "koa-compose",
"_where": "/Users/keenwon/Desktop/demo"
"version": "2.4.0"
}
This is a duplicate of What are these properties prefixing underscore used for in package.json?
Answer: https://stackoverflow.com/a/42625703/6307425
Those are meta data reserved for package registries. All properties beginning with _ or $ are reserved for package registries to use at their discretion. wiki common "Reserved Properties" section explains it.

Resources