dyna-ts-react-module-boilerplate - npm Package Compare versions

Comparing version 16.7.23 to 16.7.24

package.json

 {
   "name": "dyna-ts-react-module-boilerplate",
-  "version": "16.7.23",
+  "version": "16.7.24",
   "description": "About",
@@ -15,3 +15,4 @@ "repository": {
     "create": "echo Creation started... && rm -rf .git && rm -rf yarn.lock; mv README.md README.boilerplate.md && echo \\# readme > README.md && yarn install && node _boilerplateCreateModule.js && echo --- module created",
-    "check-deps": "yarn install --check-files",
+    "install-deps": "yarn install && yarn sync-file-deps",
+    "install-check-deps": "yarn install --check-files && yarn sync-file-deps",
     "start": "webpack-dev-server --config webpack.dev.config.js --devtool eval --progress --inline --hot --content-base dev/public --open --host localhost --port 3200 ",
@@ -21,3 +22,3 @@ "start-at": "webpack-dev-server --config webpack.dev.config.js --devtool eval --progress --inline --hot --content-base dev/public --open --host localhost --port",
     "build-analyze": "set NODE_ENV=production && webpack --config webpack.dist.analyze.config.js",
-    "build": "rm -rf ./dist/ && yarn run .build-index.d.ts && yarn run .build-dist",
+    "build": "rm -rf ./dist; yarn run .build-index.d.ts && yarn run .build-dist",
     "build-watch": "webpack --watch --config webpack.dist.config.js",
@@ -34,3 +35,6 @@ ".build-index.d.ts": "tsc && rm ./dist/index.js && yarn run .build-index.d.ts-clear",
     "test-watch": "jest --watch --verbose --runInBand",
-    "sync-externals": "node syncExternals.js",
+    "sync-file-deps": "node sync-file-deps.js",
+    "sync-file-deps-watch": "node sync-file-deps.js --watch",
+    "sync-usages": "node sync-usages.js",
+    "sync-usages-watch": "node sync-usages.js --watch",
     "release": "yarn test && yarn run build && node dyna/updateChangeId.js && git add -u && git add -A && git commit -m \"Build\" && yarn version --patch && yarn run publish-push",
@@ -71,4 +75,5 @@ "upgrade-release": "yarn upgrade && yarn run release"
     "dyna-guid": "^1.0.10",
+    "dyna-node-arguments": "^2.0.1",
     "dyna-node-fs": "^1.0.4",
-    "dyna-showcase": "^2.0.1",
+    "dyna-showcase": "^2.0.2",
     "enzyme": "^3.7.0",
@@ -144,4 +149,4 @@ "enzyme-adapter-react-16": "^1.6.0",
   "dyna": {
-    "changeId": "1dgdhb08-20505531-3841609955184760"
+    "changeId": "1f08fd13-1f8g80b2-3705388510284760"
   }
 }

README.md

 # About
 
-This is a Webpack boilerplate for Typescript React Components to use as a module in other apps or other modules.
+Webpack boilerplate for Typescript React Components to use as a module in other apps or other modules.
 
@@ -15,4 +15,5 @@ Develop, debug, test, Storybook, and distribute React component(s).
 ```
-That's it. 
 
+That's all. 
+
 # Why is `create-react-app` different?
@@ -61,3 +62,3 @@
 
-The source code of your project is under the `/src/` folder only. The distributed module is what exported from the `/src/index.tsc` only.
+The source code of your project is under the `/src/` folder only. The distributed module is what is exported from the `/src/index.tsc` only.
 
@@ -84,3 +85,3 @@ There are loaders for various files, like: `.less`, `.scss`, `.svg`, `.jpg`, `etc.`. Loaders *are loaded* in `/webpack.loaders.js`, where you can add your own loaders that will be used for all tasks (npm scripts).
 
-Under the `/dev/app/` folder, there is a small web application that can use your module component in different ways. 
+Under the `/dev/app/` folder, a small web application can use your module component in different ways. 
 This way, you can develop, debug, and create a demo of your component.
@@ -149,22 +150,63 @@
 
-# Features (tips)
+# Features
 
-## Link your modules easily
+## Link with `sync-usages`
 
-In case that the `yarn link` doesn't work for any reason, this boilerplate offers a unidirectional sync mechanism. It updates other modules (npm packages) that depend on it.
+### About
 
-0. Copy `./syncExternalsList.sample.js` to `./syncExternalsList.js` once only. 
-1. Update the `./syncExternalsList.js` list with external apps you want to keep them sync.
-2. Call `yarn sync-externals`
+Link your modules easily with the `yarn sync-usages --watch` watcher script.
 
-If you use the Ubuntu shell of Win10, in the `./syncExternalsList.js` you can add a windows path prefixing it with the `*tus*`, _which stands for `to ubuntu shell`_.
+In case that the `yarn link` doesn't work for any reason, this boilerplate offers a "copy" approach to update the packages.
 
-For example, check the 2nd line of `./syncExternalsList.sample.js`.
+The script performs:
 
-**Note:** the `./syncExternalsList.js` is git ignored! 
+- Scans deeply for usages of this package in all siblings folders
+- Updates all usages with the content of this package, excluding the `node_modules` of this package
+- Before the copy clears the target `src` && `dist` folders
 
+### Run
+
+- Call `yarn sync-usages` to sync it once
+- Call `yarn sync-usages --watch` for run in watcher mode
+
+### Prerequisite
+
+For all except Mac desktops, you have to install the `rsync` on your system. _See below how to do it._
+
+## Link with `sync-file-deps`
+
+### About
+
+This is the opposite of the `yarn sync-file-deps --watch`. It doesn't sync the package's usages, but it updates this package's dependencies with "file:" as version.
+
+Yarn by default links only on `yarn upgrade` the file dependencies. Use the `sync-usages-watch`.
+
+The script performs:
+
+- Watched the changes of the dependencies
+- Deletes, recreates, and copies all items of the dependency folder (as defined in the `file:`)
+- It doesn't copy the `node_modules` folder.
+
+### Run
+
+- Call `yarn sync-file-deps` to sync it once
+- Call `yarn sync-file-deps --watch` for run in watcher mode
+
+### Prerequisite
+
+For all except Mac desktops, you have to install the `rsync` on your system. _See below how to do it._
+
+## About the `rsync` prerequisite
+
+You have to install the `rsync` on your system.
+- For Mac, you don't need to do anything. It is already there.
+- For Linux [follow this guide](https://www.hostinger.com/tutorials/how-to-use-rsync)
+- For Windows's _not a clear guid has been found, feel free to fork this doc._ 
+
 # Known issues
 
-- HMR is not implemented, fork me!
+## HMR performs only full refresh
 
+The callbaks are not called, only the page is refreshed. Forks are welcome.
+
 # Typescript module without React?
@@ -171,0 +213,0 @@

webpack.plugins.js

@@ -7,19 +7,26 @@ const webpack = require('webpack');
 
-    // new webpack.IgnorePlugin(/\/something$/),
+    // new webpack.IgnorePlugin(/\/something$/),            // Ignore something
+    // new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/), // Ignore Moment's locale
 
     new CircularDependencyPlugin({
       // `onStart` is called before the cycle detection starts
-      onStart({ compilation }) {
-        console.log('start detecting webpack modules cycles');
+      onStart({compilation}) {
+        console.log('Circular Dependency: Start detecting webpack modules cycles');
       },
       // `onDetected` is called for each module that is cyclical
-      onDetected({ module: webpackModuleRecord, paths, compilation }) {
+      onDetected({module: webpackModuleRecord, paths, compilation}) {
         // `paths` will be an Array of the relative module paths that make up the cycle
         // `module` will be the module record generated by webpack that caused the cycle
-        if (paths[0].indexOf('node_modules/') === 0) return; // ignore node_modules
-        compilation.errors.push(new Error(paths.join(' -> ')))
+        if (paths[0].indexOf('node_modules/') > -1) return; // ignore node_modules
+        compilation.errors.push(new Error(
+          [
+            'Circular Dependency detected:',
+            webpackModuleRecord,
+            paths.join(' -> '),
+          ].join(' '),
+        ))
       },
       // `onEnd` is called before the cycle detection ends
-      onEnd({ compilation }) {
-        console.log('end detecting webpack modules cycles');
+      onEnd({compilation}) {
+        console.log('Circular Dependency: End detecting webpack modules cycles');
       },
@@ -26,0 +33,0 @@ }),

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Uses eval

Supply chain risk

Package uses dynamic code execution (e.g., eval()), which is a dangerous practice. This can prevent the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

126484

increased by6.83%

Number of package files

59

increased by7.27%

Lines of code

1976

increased by10.89%

Number of lines in readme file

216

increased by24.14%

Worsened metrics

Dev dependency count

63

increased by1.61%

Number of low supply chain risk alerts

4

increased by33.33%

Number of medium supply chain risk alerts

4

increased by300%

No dependency changes