Modulism

CLI for keeping track of how modules depend on each other in your project. Allows you to see where the module is being used and what other modules it imports by one command.

DOCUMENTATION

Design goals

• Simplify working with modular architecture in frontend apps.
• Put information about how modules depend on each other into one place.
• Make easier to detect unnecessary dependencies.

How it works

It simply reads all files in your working directory and parse all of their imports. After that, it determines which file belongs to which module (You mark a module by putting .modulism file in it's root directory). And then, you can see all the information by running modulism log command in your console.

- config.modulism.json file example

{
  "workDir": "src",
  "extensions": "ts, js",
  "modules": {
    "one": {
      "imports": [ "two" ],
      "exports": []
    },
    "two": {
      "imports": [],
      "exports": [ "one" ]
    }
  }
}

- project file system example

- project
    - src
        - one
            index.js
            one.modulism (module description or just an empty file)
        - two
            index.js
            two.modulism (module description or just an empty file)
    config.modulism.json
    package.json

Installation

npm i -g modulism // For local development
npm i modulism // For production pre build check 

// package.json
...
scripts": {
    "test:modulism": "modulism check"
},
...

Getting started

1. All modulism cli commands must be fired from the root directory of your project.
2. All modules names must not contain any symbols except: latin characters, numbers, "_", "-". They also must not contain word "modulism".
3. All modules groups names must not contain any symbols except: latin characters, numbers, "_", "-". They also must not contain words "modulism" and "common".

Supported file's list to parse imports from:

• js
• jsx
• ts
• tsx
• mjs
• vue
• less
• css

1. Creating config file

To create your modulism config file run modulism init.

Set workDir property to your project working directory. Example: "workDir": "src"

Set extensions property to file extensions that your project uses. ( Currently only available extensions are ts, js, less and css ) Example: "extensions": "ts, js, less"

[Optional] Set paths property to import path vatiables you use in your project. Example: In your project - import utils from '@common/utils' @common/ is actually commonMod dir in your project's root directory. Your modulism paths property:

...
"paths": {
    "@common": "commonMod/"
},
...

2. Create modules

Module is a folder with isolated code in it. Add a <moduleName>.modulism file in root directory of your module. It could be empty or has module's description in it.

You can also split your modules by groups so the result data would be more informative for you. You can do it in two ways.

1. Determine group directory. To determine group directory just add .<groupName>.modulism file in your group directory.
2. Determine group file. To determine group file add *modulism-group <groupName> line in comments of your file.

Example module:

moduleEvents
    - constants
        ...
        .constants.modulism
    - logic
        ...
        .logic.modulism
    index.js
    moduleEvents.modulism

3. Generate modules dependencies config

Run modulism sync. It will update your config file with all data it got from parsing your project.

4. Log results

To check the information about your project's modules run modulism log in terminal. It will return all modules with their dependencies. If you want to check specific modules just write them like this modulism log <module1> <module2>....

Example log result of a module:

- Blue dots are groups which are being imported to module.

- Purple dots are groups which module is exporting.