VS Code extension project structure

VS Code extension project structure

Explorer

  • .git…
  • .vscode
  • extensions.json
  • launch.json
  • settings.json
  • tasks.json
  • .huskynew
  • pre-commitnew
  • .vscode-test…, not committed
  • .editorconfignew
  • .gitignore
  • .nvmrcnew
  • .vscode-test.mjs
  • .vscodeignore
  • CHANGELOG.md
  • coverage…new, not committed
  • dist…, not committed
  • esbuild.js
  • eslint.config.mjs
  • imagesnew
  • icon.pngnew
  • demo.gifnew
  • LICENSEnew
  • medianew
  • todo-light.svgnew
  • node_modules…, not committed
  • out…, not committed
  • package-lock.json
  • package.json
  • README.md
  • src
  • config.tsnew
  • extension.ts
  • state.tsnew
  • tsconfig.json
  • vsc-extension-quickstart.md
  1. # Generate the extension without installing Yeoman globally (pick "New Extension (TypeScript)" and the esbuild bundler)

    npx --package yo --package generator-code -- yo code
  2. # Open it and press F5 to launch the Extension Development Host

    cd todo-lens && code .
  3. # Run the extension tests in a downloaded VS Code

    npm test
  4. # Production: package a .vsix to install locally or attach to a release

    npx vsce package
  5. # Production: publish to the Visual Studio Marketplace

    npx vsce publish
  6. # Production: publish the same .vsix to Open VSX for VS Code forks

    npx ovsx publish todo-lens-1.0.0.vsix -p $OVSX_PAT
  7. # Expert: publish a pre-release version for early testers

    npx vsce publish --pre-release