2

Assume you use a library like vue3-datepicker. You realize you need to customize something, and as as first step you want to use a custom fork of it.

The issue is, there is a build step when the package is pushed to npm's registry since the project doesn't use plain JavaScript, but may have vue or typescript files.

In this case, that would be npm run build:component, though that depends on the project.

Just installing the fork from github via:

yarn add <GitHub user name>/<GitHub repository name>#<branch/commit/tag>

hence doesn't suffice as then the ./dist folder doesn't exist.

You'll get really strange errors like:

error: [plugin: vite:dep-scan] Failed to resolve entry for package "vue3-datepicker". The package may have incorrect main/module/exports specified in its package.json: Failed to resolve entry for package "vue3-datepicker". The package may have incorrect main/module/exports specified in its package.json.

As a quick and dirty solution, I removed in my fork the ./dist/ folder from the .gitignore, ran the npm i && npm run build:component in my fork, and pushed it.

Huge downside is, the ./dist/ folder is now part of that repository, after each change in my fork I also have to build the files again and push those as well.

I rather have the build process triggered in my application using my fork. Is there a way from my application to say:

When you install that library, you have to run a certain script once you downloaded all the files?

The solution should be usable for both npm and yarn, in the sense that the fork my be installed by either one in different applications.

RobC
  • 22,977
  • 20
  • 73
  • 80
k0pernikus
  • 60,309
  • 67
  • 216
  • 347

2 Answers2

1

A quote from npm-install Docs

If the package being installed contains a prepare script, its dependencies and devDependencies will be installed, and the prepare script will be run, before the package is packaged and installed.

so in your fork's package.json you can add

"scripts": {
    // ...
    "build:component": "rollup -c build/rollup.config.js",
    "prepare": "yarn build:component || npm run build:component"
}
Teneff
  • 30,564
  • 13
  • 72
  • 103
  • I dislike it being part of the fork, in case one wants to create a PR from the branch. (It beats comitting the entire dist folder though) – k0pernikus Aug 26 '21 at 14:41
  • 1
    @k0pernikus, agree, but you can create "installable" brach adding only that script on top of your changes – Teneff Aug 26 '21 at 14:47
0

If you want to trigger builds after installation, you can use the postinstall or a build script in your package.json. In this script, you can create directories and do other setups, using shell commands or javascript programs:

{
  "scripts": {
    "build": "mkdir dist && npm run build:component",
    "build:component": "some command"
  }
}
theusaf
  • 1,781
  • 1
  • 9
  • 19