-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
0 parents
commit dcef939
Showing
11 changed files
with
4,485 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,175 @@ | ||
# Based on https://raw.githubusercontent.com/github/gitignore/main/Node.gitignore | ||
|
||
# Logs | ||
|
||
logs | ||
_.log | ||
npm-debug.log_ | ||
yarn-debug.log* | ||
yarn-error.log* | ||
lerna-debug.log* | ||
.pnpm-debug.log* | ||
|
||
# Caches | ||
|
||
.cache | ||
|
||
# Diagnostic reports (https://nodejs.org/api/report.html) | ||
|
||
report.[0-9]_.[0-9]_.[0-9]_.[0-9]_.json | ||
|
||
# Runtime data | ||
|
||
pids | ||
_.pid | ||
_.seed | ||
*.pid.lock | ||
|
||
# Directory for instrumented libs generated by jscoverage/JSCover | ||
|
||
lib-cov | ||
|
||
# Coverage directory used by tools like istanbul | ||
|
||
coverage | ||
*.lcov | ||
|
||
# nyc test coverage | ||
|
||
.nyc_output | ||
|
||
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) | ||
|
||
.grunt | ||
|
||
# Bower dependency directory (https://bower.io/) | ||
|
||
bower_components | ||
|
||
# node-waf configuration | ||
|
||
.lock-wscript | ||
|
||
# Compiled binary addons (https://nodejs.org/api/addons.html) | ||
|
||
build/Release | ||
|
||
# Dependency directories | ||
|
||
node_modules/ | ||
jspm_packages/ | ||
|
||
# Snowpack dependency directory (https://snowpack.dev/) | ||
|
||
web_modules/ | ||
|
||
# TypeScript cache | ||
|
||
*.tsbuildinfo | ||
|
||
# Optional npm cache directory | ||
|
||
.npm | ||
|
||
# Optional eslint cache | ||
|
||
.eslintcache | ||
|
||
# Optional stylelint cache | ||
|
||
.stylelintcache | ||
|
||
# Microbundle cache | ||
|
||
.rpt2_cache/ | ||
.rts2_cache_cjs/ | ||
.rts2_cache_es/ | ||
.rts2_cache_umd/ | ||
|
||
# Optional REPL history | ||
|
||
.node_repl_history | ||
|
||
# Output of 'npm pack' | ||
|
||
*.tgz | ||
|
||
# Yarn Integrity file | ||
|
||
.yarn-integrity | ||
|
||
# dotenv environment variable files | ||
|
||
.env | ||
.env.development.local | ||
.env.test.local | ||
.env.production.local | ||
.env.local | ||
|
||
# parcel-bundler cache (https://parceljs.org/) | ||
|
||
.parcel-cache | ||
|
||
# Next.js build output | ||
|
||
.next | ||
out | ||
|
||
# Nuxt.js build / generate output | ||
|
||
.nuxt | ||
dist | ||
|
||
# Gatsby files | ||
|
||
# Comment in the public line in if your project uses Gatsby and not Next.js | ||
|
||
# https://nextjs.org/blog/next-9-1#public-directory-support | ||
|
||
# public | ||
|
||
# vuepress build output | ||
|
||
.vuepress/dist | ||
|
||
# vuepress v2.x temp and cache directory | ||
|
||
.temp | ||
|
||
# Docusaurus cache and generated files | ||
|
||
.docusaurus | ||
|
||
# Serverless directories | ||
|
||
.serverless/ | ||
|
||
# FuseBox cache | ||
|
||
.fusebox/ | ||
|
||
# DynamoDB Local files | ||
|
||
.dynamodb/ | ||
|
||
# TernJS port file | ||
|
||
.tern-port | ||
|
||
# Stores VSCode versions used for testing VSCode extensions | ||
|
||
.vscode-test | ||
|
||
# yarn v2 | ||
|
||
.yarn/cache | ||
.yarn/unplugged | ||
.yarn/build-state.yml | ||
.yarn/install-state.gz | ||
.pnp.* | ||
|
||
# IntelliJ based IDEs | ||
.idea | ||
|
||
# Finder (MacOS) folder config | ||
.DS_Store |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
{ | ||
// Use IntelliSense to learn about possible attributes. | ||
// Hover to view descriptions of existing attributes. | ||
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 | ||
"version": "0.2.0", | ||
"configurations": [ | ||
{ | ||
"name": "Run Extension", | ||
"type": "extensionHost", | ||
"request": "launch", | ||
"args": ["--extensionDevelopmentPath=${workspaceFolder}"], | ||
"outFiles": ["${workspaceFolder}/dist/**/*.cjs"], | ||
"preLaunchTask": "${defaultBuildTask}" | ||
} | ||
] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
{ | ||
"version": "2.0.0", | ||
"tasks": [ | ||
{ | ||
"type": "bun", | ||
"script": "bun run ./scripts/build-with-esbuild.ts", | ||
"problemMatcher": [], | ||
"label": "bun: build", | ||
"detail": "bun run ./scripts/build-with-esbuild.ts - package.json", | ||
"group": { | ||
"kind": "build", | ||
"isDefault": true | ||
} | ||
} | ||
] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,69 @@ | ||
# Bun VSCode Extension Template | ||
|
||
This is a Bun template that contains the scaffolding of a VSCode extension. | ||
|
||
## Features | ||
|
||
- bun integration | ||
- typescript support | ||
- jest support for testing | ||
- running your extension via a VSCode launch config (i.e. using `F5`) | ||
- placeholder extension metatdata in `package.json` | ||
|
||
## How this template works | ||
|
||
### Files and folders | ||
|
||
- `.vscode` - contains the config for vscode | ||
- `launch.json` - contains the config that enables running the extension with `F5` | ||
- `tasks.json` - contains the config that defines the default build task, used in `launch.json` | ||
- `dist` - contains the transpiled source files | ||
- `extension.cjs` - the transpiled version of `src/extension.ts`. Uses `cjs` extension to conform to CommonJS (which is required for VSCode extensions) | ||
- `mocks` - for testing. Contains mocked versions of libraries | ||
- `vscode.ts` - the mocked out version of the vscode library. I'm not quite sure what the structure of the normal library is, but I had a hell of a time getting it to work with bun and bun test. I think just the types are published, but the source code isn't, and then when your extension is built and bundled, the actual implementation of all the api calls used in your extension live within vscode itself. Quite complex, quite annoying. I'm sure I'm missing something and there's a better way but :shrug: | ||
- `scripts` | ||
- `build-with-esbuild.ts` - contains the logic to build the app with esbuild. Since esbuild does not use config files like the rest of the bundlers, this is the way to move all of that config into a file somewhere other than `package.json`. In order to get around the annoyances with the `vscode` package not actually existing, the `vscode` package is marked as "external" (and therefore not required to be resolvable). | ||
- `src` - contains the source files | ||
- `extension.ts` - the extension file. | ||
- `extension.test.ts` - the test for the extension | ||
|
||
### Developing | ||
|
||
The extension is located at `src/extension.ts`. | ||
|
||
The template's `package.json` already has all the options configured to create a "Hello World" extension. | ||
|
||
### Testing | ||
|
||
Write your tests at `src/extension.test.ts` | ||
|
||
The tests there are unit tests, which is to say that all the dependencies of the subject under test are mocked out. They are mocked out by two means: | ||
|
||
1. `spyOn` from bun's testing package | ||
2. `mocks/vscode.ts` | ||
|
||
The first is normal spying/mocking as you'd find in any other test. | ||
|
||
The second is required because the `vscode` package doesn't actually contain any implementation - only types (see notes on `build-with-esbuild.ts`). The `mocks` folder is hooked up by the `paths.vscode` value in `tsconfig.json` so that when you `import * as vscode from "vscode"`, rather than looking in `node_modules` for `vscode`, the resolver looks in `./mocks/vscode.ts`. | ||
|
||
This second part is required so that when running tests, `import * as vscode from "vscode"` in the implementation file actually returns something (the something it returns is determined by the contents of `./mocks/vscode.ts`). | ||
|
||
### Running | ||
|
||
To run the extension, simply press `F5` or go to `Run and Debug > Run Extension`. A new VSCode instance will be started and your extension will be loaded in there. You can `console.log` and set breakpoints, too! | ||
|
||
## Differences with the stock Yeoman generator | ||
|
||
- This template does not use mocha as described in the [VSCode - Testing Extensions](https://code.visualstudio.com/api/working-with-extensions/testing-extension) docs | ||
- It also does not use `vscode-test` like the [Yeoman generator](https://code.visualstudio.com/api/get-started/your-first-extension) does | ||
- It uses `esbuild` rather than webpack | ||
|
||
I generally found that the Yeoman template uses older technologies like mocha and webpack that don't play well with newer tooling, and so I did my best to replicate and update the functionality present in the Yeoman generator. | ||
|
||
## Possible errors | ||
|
||
``` | ||
Activating extension 'undefined_publisher.vscode-extension-with-bun' failed: require() of ES Module dist/extension.js from /Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/loader.js not supported. extension.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules. Instead rename extension.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead). | ||
``` | ||
|
||
This error is produced because VSCode can't load your extension. This is probably happening because the file you're tyring to load is using ESM instead of CommonJS. You can fix this by fiddling with the settings in `build-with-esbuild.ts`. |
Binary file not shown.
Oops, something went wrong.