Why is tsc command not found in child package in yarn workspace? - yarn-v2

I'm using yarn version 3.2.4. I have a package.json in my root that looks like this:
{
"scripts": {
"compile": "tsc --build",
},
"devDependencies": {
"typescript": "^4.8.4"
}
}
In packages/foo, I have this package.json
{
"scripts": {
"compile": "tsc --build"
},
"devDependencies": {
}
}
When I run yarn compile from the root, tsc compiles correctly. But this fails:
cd packages/foo
yarn compile
command not found: tsc
If I change the child packages to include typescript as a devDependency then it works.
Why aren't the devDependencies inherited from the parent package.json?

Related

Why No Matching Commands when I init my first vscode extension?

I init my first vscode extension following this page.
Here is my steps:
npm install -g yo generator-code
yo code
And here is the package.json generated:
{
"name": "helloworld",
"displayName": "helloworld",
"description": "description helloworld",
"version": "0.0.1",
"engines": {
"vscode": "^1.72.0"
},
"categories": [
"Other"
],
"activationEvents": [
"onCommand:helloworld.helloWorld"
],
"main": "./out/extension.js",
"contributes": {
"commands": [
{
"command": "helloworld.helloWorld",
"title": "Hello World"
}
]
},
"scripts": {
"vscode:prepublish": "npm run compile",
"compile": "tsc -p ./",
"watch": "tsc -watch -p ./",
"pretest": "npm run compile && npm run lint",
"lint": "eslint src --ext ts",
"test": "node ./out/test/runTest.js"
},
"devDependencies": {
"#types/glob": "^8.0.0",
"#types/mocha": "^10.0.0",
"#types/node": "16.x",
"#types/vscode": "^1.72.0",
"#typescript-eslint/eslint-plugin": "^5.38.1",
"#typescript-eslint/parser": "^5.38.1",
"#vscode/test-electron": "^2.1.5",
"eslint": "^8.24.0",
"glob": "^8.0.3",
"mocha": "^10.0.0",
"typescript": "^4.8.4"
}
}
When I press H5 to debug, I got no command matched here:
I was stuck here for a while, where is my command??
I've encountered this just now as well. Make sure that engines.vscode in package.json matches the version of vscode you are running:
"engines": {
"vscode": "^1.73.0"
},
I guess the generator will use the latest version available, but you might not have upgraded yet. That was the case for me.
#tacospice pointed out exactly. in package.json, engines.vscode determines minimum version of VSCode. In my case, yo created extension template which set minimum VSCode version(1.74.0) newer than working VSCode(1.70.0). Check Help -> About -> version with package.json.

How do I overcome parcel-bundler error create-near-app

Hi I have created a near app with a react frontend but when I try to install #date-io/date-fns I get an error:
Cannot read property 'length' of undefined
at lineCounter (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\utils\lineCounter.js:3:30)
at JSPackager.writeModule (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\packagers\JSPackager.js:127:60)
at async JSPackager.addAsset (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\packagers\JSPackager.js:88:5)
at async Bundle._addDeps (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\Bundle.js:250:5)
at async Bundle._package (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\Bundle.js:219:7)
at async Promise.all (index 0)
at async Bundle.package (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\Bundle.js:202:5)
at async Promise.all (index 2)
at async Bundle.package (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\Bundle.js:202:5)
at async Bundler.bundle (C:\Users\Simon Palmer\Documents\Programming\bimstarter-app\node_modules\parcel-bundler\src\Bundler.js:325:27)
my package.json file is as follows
{
"name": "bimstarter-app",
"version": "0.1.0",
"license": "UNLICENSED",
"scripts": {
"build": "npm run build:contract && npm run build:web",
"build:contract": "node contract/compile.js",
"build:contract:debug": "node contract/compile.js --debug",
"build:web": "parcel build src/index.html --public-url ./",
"dev:deploy:contract": "near dev-deploy",
"deploy:contract": "near deploy",
"deploy:pages": "gh-pages -d dist/",
"deploy": "npm run build && npm run deploy:contract && npm run deploy:pages",
"prestart": "npm run build:contract:debug && npm run dev:deploy:contract",
"start": "echo The app is starting! It will automatically open in your browser when ready && env-cmd -f ./neardev/dev-account.env parcel src/index.html --open",
"dev": "nodemon --watch contract -e ts --exec \"npm run start\"",
"test": "npm run build:contract:debug && cd contract && npm run test && cd .. && jest test --runInBand"
},
"devDependencies": {
"#babel/core": "~7.14.0",
"#babel/preset-env": "~7.14.0",
"#babel/preset-react": "~7.13.13",
"babel-jest": "~26.6.2",
"env-cmd": "~10.1.0",
"gh-pages": "~3.1.0",
"jest": "~26.6.2",
"jest-environment-node": "~26.6.2",
"near-cli": "~2.1.1",
"nodemon": "~2.0.3",
"parcel-bundler": "^1.12.5",
"react-test-renderer": "~17.0.1",
"shelljs": "~0.8.4"
},
"dependencies": {
"#date-io/date-fns": "^2.13.1",
"#emotion/react": "^11.9.0",
"#emotion/styled": "^11.8.1",
"#mui/icons-material": "^5.6.2",
"#mui/material": "^5.6.2",
"#mui/x-date-pickers": "^5.0.0-alpha.1",
"near-api-js": "~0.43.1",
"react": "~17.0.1",
"react-dom": "~17.0.1",
"react-router-dom": "6",
"regenerator-runtime": "~0.13.5"
},
"resolutions": {
"#babel/preset-env": "7.13.8"
},
"jest": {
"moduleNameMapper": {
"\\.(jpg|ico|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/src/__mocks__/fileMock.js",
"\\.(css|less)$": "<rootDir>/src/__mocks__/fileMock.js"
},
"setupFiles": [
"<rootDir>/src/jest.init.js"
],
"testEnvironment": "near-cli/test_environment",
"testPathIgnorePatterns": [
"<rootDir>/contract/",
"<rootDir>/node_modules/"
]
}
This happened also when I was trying to install react bootstrap.
To build again does the parcel-bundler need to be upgraded to parcel as it has been depreciated? If so how do I do this without effecting the rest of the near app code dependencies?

Can't run vscode extension app in certain vscode versions

I created a vscode extension app and it works perfectly for some versions of vscode and not for others. So far, I've noticed this issue only in mac, but doesn't mean the same issue might happen for other versions of windows. In mac, when I try my extension app on version 1.40.2 it doesn't seem to work. There is no option to run my app in command palette or context menu. It's missing. But if I try it on version 1.55.2 (Universal) then the extension app appears and runs successfully in context menu and command palette no problem.
When I run it on my mac on version 1.40.2, I get the dialog message Extension is not compatible with Code 1.40.2. Extension requires: ^1.55.0.
Another error I've seen is in the console it come up with this error, which I created a new project by running yo code in that problem vscode version and hit F5 on a fresh template and I still got this error so not sure if it's related or not.
Error: Invalid problemMatcher reference: $ts-webpack-watch
Error: Invalid problemMatcher reference: $tslint-webpack-watch
I've also seen this error too
Why am I having a version compatibility issue? I don't think it's something in my extension.ts file because if I remove all my code ie
'use strict';
import * as vscode from 'vscode';
const ncp = require("copy-paste");
const os = require('os');
let folderOutput: string;
let fileOutput: vscode.Uri;
export function activate(context: vscode.ExtensionContext) {
let disposable = vscode.commands.registerCommand('my-app.startApp', async (uri: vscode.Uri) => {
});
context.subscriptions.push(disposable);
}
then the issue is still there so that eliminates that file from being the issue. I appreciate any help!
Package.json
{
"name": "my-app",
"displayName": "my app",
"description": "does something interesting",
"version": "0.0.1",
"engines": {
"vscode": "^1.55.0"
},
"categories": [
"Other"
],
"activationEvents": [
"onCommand:my-app.startApp"
],
"main": "./dist/extension.js",
"contributes": {
"commands": [
{
"command": "my-app.startApp",
"title": "Start My App"
}
],
"menus": {
"editor/context": [
{
"command": "my-app.startApp"
}
]
}
},
"scripts": {
"vscode:prepublish": "npm run package",
"compile": "webpack",
"watch": "webpack --watch",
"package": "webpack --mode production --devtool hidden-source-map",
"test-compile": "tsc -p ./",
"test-watch": "tsc -watch -p ./",
"pretest": "npm run test-compile && npm run lint",
"lint": "eslint src --ext ts",
"test": "node ./out/test/runTest.js"
},
"devDependencies": {
"#types/vscode": "^1.55.0",
"#types/glob": "^7.1.3",
"#types/mocha": "^8.0.4",
"#types/node": "^12.11.7",
"eslint": "^7.19.0",
"#typescript-eslint/eslint-plugin": "^4.14.1",
"#typescript-eslint/parser": "^4.14.1",
"glob": "^7.1.6",
"mocha": "^8.2.1",
"typescript": "^4.1.3",
"vscode-test": "^1.5.0",
"ts-loader": "^8.0.14",
"webpack": "^5.19.0",
"webpack-cli": "^4.4.0"
},
"dependencies": {
"copy-paste": "^1.3.0",
"simple-git": "^2.38.0"
}
}

dotenv not working after transcompile with Babel

I have code reading .env using dotenv that is working in dev but after transcompiling with Babel the values from process.env are undefined. I created a sample program to illustrate the problem which is below.
If I'm in projectRoot and run
npm run start-w
then
console.log(process.env.VAR1)
prints the value 'var1Val'
However, if I do
npm run build
cd dist
node index.js
the value of VAR1 is 'undefined'.
index.js
import 'dotenv/config'
console.log('VAR1', process.env.VAR1)
.env
VAR1=var1val
VAR2=var2val
VAR3=var3val
.babelrc
{
"presets": ["#babel/preset-env"],
"plugins": [
"#babel/plugin-transform-runtime",
]
}
package.json
{
"name": "dotenv.node-babel",
"version": "1.0.0",
"description": "",
"main": "index.js",
"dependencies": {
"#babel/runtime": "^7.4.3",
"dotenv": "^7.0.0"
},
"devDependencies": {
"#babel/cli": "^7.4.3",
"#babel/core": "^7.4.3",
"#babel/node": "^7.2.2",
"#babel/plugin-transform-runtime": "^7.4.3",
"#babel/preset-env": "^7.4.3",
"#types/dotenv": "^6.1.1",
"nodemon": "^1.18.11",
"rimraf": "^2.6.3"
},
"scripts": {
"clean-dist": "rimraf dist",
"build": "npm run-script clean-dist && babel . -d dist --ignore node_modules",
"start": "babel-node index.js",
"start-w": "NODE_ENV=devLocal nodemon --exec babel-node index.js"
},
"author": "",
"license": "ISC"
}
If you do not have a .env file in your build directory, try creating one. I guess that's why the environment variable is undefined.

What if I installed devDependency package as dependency, do I need to reinstall it as devDependency?

Most of the time, when I need to install a package as a devDependency but I forget to add --save-dev command thus this installation is final to dependency.
What I do:
"dependencies": {
"#types/express": "^4.11.1"
},
"devDependencies": {
}
But my requirement is:
"dependencies": {
},
"devDependencies": {
"#types/express": "^4.11.1"
}
Now, do I need to reinstall it as devDependency or cut and paste in devDependency is OK?