Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Usage in an npm monorepo #29

Open
rajsite opened this issue Mar 8, 2022 · 1 comment
Open

Usage in an npm monorepo #29

rajsite opened this issue Mar 8, 2022 · 1 comment

Comments

@rajsite
Copy link

rajsite commented Mar 8, 2022

When the design system package is used inside an npm 7 monorepo the vscode extension is not aware of that and runs npm install from within the directory instead of the monorepo root.

In addition it updates the package.json in the design system package folder of the monrepo but that leaves the monorepo root package-lock.json outdated.

What I expect is the package.json for the design system package to be updated the correct version of style-dictionary and for the the actual npm install command to happen at the monorepo root.

Alternatively I would like to have a configuration setting to opt-out of automatic npm installs and instead show a notification that packages at a specific version are needed.

@rajsite
Copy link
Author

rajsite commented May 26, 2022

With npm 8, a dsp package is now very difficult to use in a monorepo. When the Adobe DSP addon attempts to run npm install in the dsp folder the npm cli now behaves well and has that command run at the root of the repo. Unfortunately that means the Adobe DSP tool cannot find the styledictionary instance that was installed.

The DSP extension should be trying to find the styledictionary relying on node module resolution instead of assuming the file is located in a node_modules folder next the the package, ie:

function resolvePackagePath(packageName) {
    return path.dirname(require.resolve(`${packageName}/package.json`));
}
resolvePackagePath('style-dictionary');

rajsite added a commit to ni/nimble that referenced this issue May 27, 2022
# Pull Request

## 🤨 Rationale

In trying to clean-up the nimble-tokens package during testing I found that recent (good) changes to npm 8 now cause the DSP extension to fail to find `style-dictionary`. I reported the behavior here: AdobeXD/design-system-package-dsp#29 (comment)

This PR adds a workaround for that issue by adding `style-dictionary` as a pinned devDependency to the root package and with a different version pinned as a devDependency in the `nimble-tokens` package. This forces a copy to be installed in `node_modules` for `nimble-tokens` and an unused copy to be installed at `node_modules` in the monorepo root.

In addition, the `hex-rgb` version was pinned for `style-dictionary` as the latest `hex-rgb` version switches to es6 modules and breaks the `nimble-extensions.js` script.

Also removed the `assets` folder from the source tree that is created by the DSP. We currently are not leveraging the component definitions in the DSP, only the tokens, and this improves maintainability for now.

## 👩‍💻 Implementation

See above.

## 🧪 Testing

Built the DSP locally.

## ✅ Checklist

- [x] I have updated the project documentation to reflect my changes or determined no changes are needed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant