I try to build and debug an extension in Code.
I downloaded the sample of word-count from https://github.com/microsoft/vscode-wordcount.
When I clicked F5, ./out folder was not generated and I saw failure: Activating extension ms-vscode.wordcount failed: Cannot find module 'd:/VSCode/vscode-wordcount/out/extension'.
I found the post
https://github.com/Microsoft/vscode-go/issues/35
and I think this was because I failed to build the extension.
And I checked my path that node and npm were both set.
I found there were 2 possible issues.
I could not find .\node_modules folder in my extension folder. The folder structure is like
.vscode\
-- launch.json
-- settings.json
-- tasks.json
image\
test\
typings\
-- vscode-typings.d.ts
extension.ts
package.json
tsconfig.json
My node version is v0.12.2.
Could you give me some hints how to investigate the issue?
You probably downloaded directly from GitHub.
You will need to run npm install in your project's folder in order to create the node_modules directory and add the required dependencies.
If you simply want to install the extension to use it, you will also need to:
Move the folder to the correct place
npm install
OR
Install the built version directly from the Visual Studio Marketplace through the command pallet.
Related
I recently started to work on a Go project.
When I use gopls with Coc, all external imports are not recognized such as "github.com/prometheus/client_golang/prometheus". It complains it could not find this module from neither $GOROOT and $GOPATH.
This project is managed by bazel, and all depedencies are listed in WORKSPACE file. Do I have any way to install all packages based on WORKSPACE file or I have to go install all packages one by one? If the latter, I would imagine keep package version synced is challenaging.
To install all dependencies listed in the WORKSPACE file in a Bazel-managed Go project, you can use the bazel run command and the go_repository rule in the WORKSPACE file.
For example, if you have the following go_repository rule in your WORKSPACE file:
go_repository(
name = "com_github_prometheus_client_golang",
importpath = "github.com/prometheus/client_golang",
version = "0.10.0",
)
You can run the following command to install the dependencies:
bazel run //:gazelle
This will run the gazelle target, which updates the dependencies in the WORKSPACE file and generates the required BUILD files for each package in your project.
Once the dependencies are installed, they should be recognized by gopls in your editor.
I am using npm workspaces with typescript as specified in this git README https://github.com/Quramy/npm-ts-workspaces-example
When I do npm i from the project root directory it installs all packages in root directory (node_modules). It doesn't create node_modules directory in each workspace. Because of this, VSCode thinks 'module' is missing (Cannot find module 'abcde' or its corresponding type declarations), hence shows red under line on import line and doesn't show auto complete suggestion.
How can I make VSCode understand that packages are installed in root folder and use it for giving auto complete suggestion and remove red underlines under package import.
I had this issue when turning an existing project into a workspace of a larger project. Here are the steps that worked for me:
Delete package-lock.json and node_modules/ from the subdirectory
Restart VSCode, opening it to the project's new root directory
I think step (2) was the key to making it work, but I don't know for sure.
My Vue project is running fine locally, but when upload it to github repo, download it back from there and npm install, then npm run dev, it throws error Module build failed: Error: No ESLint configuration found.
When I unzip my downloaded repo-files, there's no .eslintrc etc. files that are present when I'm uploading my project, and to my knowledge that is one reason causing this ESLint problem.
Here's the very basic vue init webpack HelloWorld.vue uploaded to my test-repo without any modifications to show how it fails to build after downloading.
Link to my test repo to reproduce the error: https://github.com/tuuchen/vue-movie-app
How can I fix this issue with eslint?
EDIT: I made a fresh project without eslint, and when downloading it from my git repo, It's throwing Failed to compile error, asset optimization[copy-webpack-plugin] WARNING - unable to locate '<path>\myvueapp\static'
EDIT 2: Also .postcssrc is missing when initiating npm install
EDIT 3: Problem solved. I was using webpack for creating my vue project, and it caused all kinds of issues when downloading the project back from git repo. npm install -g #vue/cli did a project that worked without issues.
Sorry for being such a noob.
This issue came up as I created a new project by copying from another project on my Mac. However, the hidden files were not copied!
Solution
The issue got resolved by having these hidden files as well in the new project:
.babelrc,
.editorconfig
.eslintignore
.eslintrc.js
.postcssrc.js
There are other solutions that many have proposed in this Vue Issue that you can refer to if this does not solve your problem.
In my case, I just delete the folder Node.Js and try reinstall node modules using yarn/npm.
if it still did not work, you can try to add file .eslintignore on the root folder and add there the path to the folder we want to omit.
For example, in this scenario, .build/test.js is the desired file to allowlist. Because all dot-folders and their children are ignored by default, .build must first be allowlisted so that eslint becomes aware of its children. Then, .build/test.js must be explicitly allowlisted, while the rest of the content is denylisted. This is done with the following .eslintignore file:
# Allowlist 'test.js' in the '.build' folder
# But do not allow anything else in the '.build' folder to be linted
!.build
.build/*
!.build/test.js
more documentation https://eslint.org/docs/user-guide/configuring/ignoring-code#the-eslintignore-file
I want to be able to step though my C++ code for a Node.js addon that I am making. I understand that CMake.js has the --debug option, but there is no documentation about it.
I am using the node-addon-api module, in CLion.
After months of blind debugging though the use of Errors to print variables, I have finally figured out how to attach the CLion debugger to a Node.js addon.
Create a new CMake Application configuration.
Fill in these fields:
Target: Your project
Executable: The Node binary (On Unix do which node or where.exe node on Windows)
Program arguments: Path to your JS file
Working directory: The directory where the JS file is located
Before launch: Build
Start this configuration in debug mode.
I recently stumbled on the same problem and had success creating a custom toolchain in CLion 2020.3 with CMake.js on a Linux system.
Reproducible steps:
Install cmake-js via npm install -g cmake-js. Make sure to install the package globally, so that your toolchain becomes available across multiple projects.
Create a npm project, e.g mkdir my-project && cd my-project && npm init.
Run npm install bindings && npm install node-addon-api (For the C++ wrapper).
Create a CMakeLists.txt in the root directory and paste this. Make sure to replace file(GLOB SOURCE_FILES hello.cpp) with your addon-specific cpp and header files.
Open my-project in CLion.
Go to Settings / Preferences | Build, Execution, Deployment | Custom Build Targets and click + to add a new target.
Go to Build | Tool Settings | Program and set it to the cmake-js binary that you downloaded in the npm directory where you keep your global packages.
Set the arguments to compile -D and set the working directory to the root directory of my-project.
Go to Clean | Tool Settings | Program and set it to the directory where you keep your cmake-js binary. Set the arguments to clean and set the working directory to your project's root directory.
Add a new Run Configuration and specify the Toolchain you just created in the Target field. Point the Executable to your node executable and add the .js file where you import your native addons to. Set the working directory to the current directory as well. Now, you can build the target, and also debug the N-API layer of your native code, too!
I have a node_js project that includes some of our own node_js packages. They are in an npm private repo and show up in node_modules as:
#company/package_name
We are trying to set breakpoints in this code and find they are never hit.
We thought there might be a default skipFile that excludes node_modules and added to our launch.json:
"skipFiles": ["!${workspaceRoot}/node_modules/**/*.js"]
to no effect.
Any tips on how to enable debugging in the node_modules directory?
I know it's an old question but if someone still manages to stumble upon this, you can use VS code to debug node_module files by first symlinking the node_module package with the main project and then telling VS code to use the symlink.
Symlink node_module package
If you are going to be working in a node_module package, it's a good idea to symlink it so that the changes that you make from within your projects are simultaneously applied to the module's code as well and hence, when you are done editing the package, you can directly see the diff and commit it and instead of copy-pasting it from inside node_module and applying it manually.
To symlink a package inside node_module with your project, first clone the repo on your system.
Run npm link inside the directory.
Then go to your main project and then run npm link package_name to link it.
For example, if you wanted to link a package sample-node-module with a project sample-project, which uses sample-node-module as its dependency, you can do it in the following manner:
cd sample-node-module
npm link
cd sample-project
npm link sample-node-module
Be careful that you enter the folder name (and not the package name itself) of the cloned repo in the second link command. You don't have to provide the full path. You can read more about it here
Telling VS Code to use symlinks while debugging
Once you are done with above, you can simply add this small config in your launch.json of VS Code to make it detect breakpoints inside node_modules:
{
"runtimeArgs": [
"--preserve-symlinks"
]
}
Documentation about this can be found here
The problem can be with source maps. Try to add node_modules/example-package files to resolveSourceMapLocations in launch.json, where example-package is directory of module, in which you want to set breakpoint:
"resolveSourceMapLocations": [
"${workspaceFolder}/**",
"!**/node_modules/**",
"node_modules/example-package/**/*.js",
]