-
Notifications
You must be signed in to change notification settings - Fork 179
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
Cannot install carbon-vue on fresh Vue 3 project #1576
Comments
Hy, I tried the steps to mimic what you have done, but it worked for me. (Windows 11, Node 20.10.0, NPM 10.2.3) |
^^ Ditto. osx is good for me:
|
@davidnixon I've also seen this issue today; Ubuntu running WSL2 Also on the demo projhect I'm using Node v20. as well.... not yet debugged into this - contact me via whitemat@uk.ibm.com if I can help |
FYI _ I've found that |
Windows 11 23H2 Node 22.1.0, npm 10.7.0 - same issues here. Specifically targeting 3.0.14 or older versions seems to give the same errors, as well as WSL. |
I'm using WSL2 as well. Had to use Yarn to get it to work |
From above output I can see it is trying to run the "_postinstall" script in the package which is
but why? During the packaging tha script specifically gets renamed to from this works
this fails
So I think it is some new behaviour with npm 10? We do have a change in-flight in PR #1593 that changes postinstall to run the ibmtelemetry package but I think that will not fix it for node 20. Try this in node20/npm 10 npm add @carbon/icon-helpers That package also includes ibmtelemetry and I get this error:
So more clues but no solution. :-( |
any news on this? @davidnixon |
I fiddled with it a little, npm fails but pnpm and yarn works ok in wsl, node 20, npm 10. I think the difference is when each package manager resolve postinstall scripts. ...
"3.0.15": {
"name": "@carbon/vue",
"license": "Apache-2.0",
"version": "3.0.15",
"description": "A collection of components for the Carbon Design System built using Vue.js",
"packageManager": "yarn@3.2.0",
"main": "dist/carbon-vue-3.umd.min.js",
"types": "src/index.d.ts",
"web-types": "dist/web-types.json",
"scripts": {
"postinstall": "node prepare.js && node .storybook/postinstall.js && ibmtelemetry --config=telemetry.yml",
"prepack": "pinst --disable",
"postpack": "pinst --enable",
"build": "vue-cli-service build --target lib --name carbon-vue-3 ./src/index.js --no-clean",
"lint": "vue-cli-service lint",
"build-web-types": "vue-docgen-web-types --outFile dist/web-types.json",
"add-components-exports": "node addNamedComponentExports.js",
"ci-check": "yarn add-components-exports && yarn format:diff && yarn test && yarn build && yarn build-web-types",
"format": "prettier --write '**/*.{scss,css,js,md,vue}' '!**/{build,es,lib,storybook,ts,umd,.coverage}/**'",
"format:diff": "prettier --list-different '**/*.{scss,css,js,md,vue}' '!**/{dist,storybook-static,.coverage}/**'",
"format:staged": "prettier --write '**/*.{scss,css,js,md,vue}' '!**/{dist,storybook-static,.coverage}/**'",
"lint:css": "stylelint '{packages,storybook}/**/*.{vue,scss}'",
"lint:es": "eslint src/**/*.{js,vue}",
"lint:style": "vue-cli-service lint:style",
"serve:storybook": "cd ./storybook && yarn run serve",
"test": "vue-cli-service test:unit --no-coverage"
},
... |
I'm also experiencing this on Manjaro currently. |
It's definitely npm 20 + vs yarn or pnpm or npm 18- and it definitely related to a difference in how the the lifecycle scripts are executed. json
in the installed version of package.json it looks like this: "_postinstall": "node prepare.js && node .storybook/postinstall.js && ibmtelemetry --config=telemetry.yml",
"prepack": "pinst --disable",
"postpack": "pinst --enable", notice the "_" in front of "_postinstall" this should keep the postinstall script from running but it is running in npm 20+. |
I think the right next step is to move all of the postinstall to a seperate js file and try catch the execution so that errors do not prevent the install.Thoughts? |
@KeenanKunzelman @benceszenassy @morpheux @liucgbj @mbwhite @TNSaturday Could I ask you to try again with the tgz attached to PR #1602 Would be great if you added a comment to the PR or here to say if it worked or not. |
@davidnixon , please see my result below. ENV: Ubuntu 22.04 LTS, Node v20.14.0 npm 10.7.0 mem: 20GB Reproduce Steps
|
@liucgbj can you try Also, for your test case, I think the right command is be |
@liucgbj I merged a fix for this an its is included in 3.0.16. Please lmk if it works for you. If it does not I will reopen this issue. |
@davidnixon using the package you provided it works, but with 3.0.16 i see this. tryied with node_modules and package.json deleted |
@davidnixon , please see below result for ENV: Ubuntu 22.04 LTS, Node v20.14.0 npm 10.7.0 mem: 20GB |
@davidnixon , please see below result for ENV: Ubuntu 22.04 LTS, Node v20.14.0 npm 10.7.0 mem: 20GB |
I am still experiencing this issue in 3.0.17. (macOS) Here are some things I've observed:
Here is the error I am seeing:
what #1576 (comment) mentioned seems interesting, we can see that postinstall there is still the dev one. not the cleanest solution, but I have been wondering whether we could join both postinstalls into a single script and check for the existence of some local file (that is not published) |
latest repro steps: this failsrm -rf /tmp/npm-20 # if it exists
nvm use 20
npm create vite@latest app-name-20 -- --template vue
cd app-name-20
npm --cache /tmp/npm-20 i
npm --cache /tmp/npm-20 add @carbon/vue this worksrm -rf /tmp/npm-20 # if it exists
nvm use 20
npm create vite@latest app-name-20 -- --template vue
cd app-name-20
npm --cache /tmp/npm-20 i
npm pack @carbon/vue
npm --cache /tmp/npm-20 add carbon-vue-3.0.18.tgz So it only fails if installed from registry but not when install from tar ball. Hmmm! I will use a local registry for future testing |
Will try something like @guilherme-gm suggesting from slack const fs = require('fs');
const { spawnSync } = require('child_process');
if (fs.existsSync('./devPreinstall.js')) {
require('./devPreinstall.js');
require('./.storybook/postinstall.js');
} else {
spawnSync('npx', ['ibmtelemetry', '--config=telemetry.yml']);
} |
I think we finally fix this one! |
[Title]: Cannot install carbon-vue on fresh Vue 3 project
Detailed description
I'm trying to install @carbon/vue 3 on a new Vue 3 project generated using Vite Vue 3 template.
Bug.
No.
I expect
npm add
command to run succesfully. Instead got this error message:Not browser related.
3.0.13
Just trying carbon out.
Steps to reproduce the issue
npm create vite@latest app-name -- --template vue
cd
into directory and runnpm install
npm add @carbon/vue
Additional information
The text was updated successfully, but these errors were encountered: