VSCode Extension: Command 'Hello World' resulted in an error (command 'vscode-err-reproduce.helloWorld' not found)

Question

Problem Description:

I tried creating VS Code extension using the sample extension (yo code) provided in the documentation. I chose "typescript" as it's type of extension, while creating it. When I tried to run the extension, I get an error message .

Command 'Hello World' resulted in an error (command 'vscode-err-reproduce.helloWorld' not found)

Activating extension 'undefined_publisher.vscode-err-reproduce' failed: Cannot find module
 '/oct/vscode-extn-ts-error/vscode-err-reproduce/out/extension.js' Require stack: - /Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/loader.js - /Applications/Visual Studio Code.app/Contents/Resources/app/out/bootstrap-amd.js - /Applications/Visual Studio Code.app/Contents/Resources/app/out/bootstrap-fork.js.

tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "ES2020",
        "outDir": "out",
        "lib": [
            "ES2020"
        ],
        "sourceMap": true,
        "rootDir": "src",
        "strict": true   /* enable all strict type-checking options */
        /* Additional Checks */
        // "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
        // "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
        // "noUnusedParameters": true,  /* Report errors on unused parameters. */
    },
    "exclude": [
        "node_modules",
        ".vscode-test"
    ]
}

Willey

try a sample extension from the repo – Proser

Answer 1

The error is due to the compilation not running or failing to run at the launch of the extension. Hence .js file not getting created on /out/* directory

1. I solved the issue, by manually running tsc --watch from the root directory.
2. I thought, the launch of the extension by default trigger the compilation, but that wasn't the case.
3. The product documentation says,"press F5. This will compile and run the extension in a new Extension Development Host window." However, this isn't the case for me. Not sure, where it was actually failing .
4. I've opened up an bug with Microsoft for this issue.

https://github.com/microsoft/vscode-extension-samples/issues/510

Willey

In addition to the accepted answer, do not forget that the yo generator created a sub folder inside your current directory. Ensure that you run the tsc flag inside the sub folder. Watch out for the out folder. It should be created. – Hanford

Answer 2

I created the project inside a sub-folder and got this error, but closing VS Code and reopening the actual sub-folder worked for me.

Vorticella

This does not provide an answer to the question. Once you have sufficient reputation you will be able to comment on any post; instead, provide answers that don't require clarification from the asker. - From Review – Suiter

Answer 3

Check typescript installation before execute the extension

npm install -g typescript

Jambeau

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center. – Pitchford

For me, I ran npm install -g javascript and that worked. – Stranglehold

Answer 4

Please try opening your extension directly, without placing it inside any subfolder. This workaround has resolved the error for me.

Sexpot

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center. – Pitchford

Answer 5

uninstall vscode then reinstall it work for me

Checkerberry

Answer 6

I've solved mine one by:

locate the official git repo's webpack.config.js

//@ts-check

'use strict';

const path = require('path');

//@ts-check
/** @typedef {import('webpack').Configuration} WebpackConfig **/

/** @type WebpackConfig */
const extensionConfig = {
  target: 'node', // VS Code extensions run in a Node.js-context 📖 -> https://webpack.js.org/configuration/node/
    mode: 'none', // this leaves the source code as close as possible to the original (when packaging we set this to 'production')

  entry: './src/extension.ts', // the entry point of this extension, 📖 -> https://webpack.js.org/configuration/entry-context/
  output: {
    // the bundle is stored in the 'dist' folder (check package.json), 📖 -> https://webpack.js.org/configuration/output/
    path: path.resolve(__dirname, 'dist'),
    filename: 'extension.js',
    libraryTarget: 'commonjs2'
  },
  externals: {
    vscode: 'commonjs vscode' // the vscode-module is created on-the-fly and must be excluded. Add other modules that cannot be webpack'ed, 📖 -> https://webpack.js.org/configuration/externals/
    // modules added here also need to be added in the .vscodeignore file
  },
  resolve: {
    // support reading TypeScript and JavaScript files, 📖 -> https://github.com/TypeStrong/ts-loader
    extensions: ['.ts', '.js']
  },
  module: {
    rules: [
      {
        test: /\.ts$/,
        exclude: /node_modules/,
        use: [
          {
            loader: 'ts-loader'
          }
        ]
      }
    ]
  },
  devtool: 'nosources-source-map',
  infrastructureLogging: {
    level: "log", // enables logging required for problem matchers
  },
};
module.exports = [ extensionConfig ];

which said the dist is default folder, but the provided dist files were in inside 'src/test'

you need to run the npm run compile once to build dist or rename the 'dist' directory to 'src/test' to fit the config setting to locate the pre-build helloWorld function

Akim