Add web-extension support

.gitignore

@@ -1 +1,2 @@
 /node_modules/
+/dist/**

CHANGELOG.md

@@ -1,9 +1,17 @@
 # Changelog
 
-## [Unreleased](https://github.com/avenga/couper/compare-vscode/v0.9.0...master)
+## [Unreleased](https://github.com/avenga/couper/compare-vscode/v1.0.0...master)
 
 ---
 
+## [v1.0.0](https://github.com/avenga/couper-vscode/releases/tag/v1.0.0)
+
+### Added
+
+- Support for running as [web-extension](https://code.visualstudio.com/api/extension-guides/web-extensions) [#60](https://github.com/avenga/couper-vscode/pull/60)
+  - [vscode.dev](https://vscode.dev/)
+  - [github.dev](https://github.dev/github/dev)
+
 ## [v0.9.0](https://github.com/avenga/couper-vscode/releases/tag/v0.9.0)
 
 ### Added

Makefile

@@ -9,6 +9,9 @@ install:
 run:
 	code --extensionDevelopmentPath=$(__DIR__)
 
-# TAG=v0.3 make changelog
-changelog:
-	git-chglog --next-tag $(TAG) $(TAG)
+run-web:
+	code --extensionDevelopmentPath=$(__DIR__) --extensionDevelopmentKind=web
+
+host-vscode-dev:
+	$(npx serve --cors -l 5000)
+	npx localtunnel -p 5000

package.json

@@ -20,11 +20,17 @@
     "theme": "light"
   },
   "engines": {
-    "vscode": "^1.0.0"
+    "vscode": "^1.59.0"
   },
   "main": "src/extension.js",
+  "browser": "dist/web/extension.js",
   "scripts": {
-    "watch": "true"
+    "pretest": "npm run compile-web",
+    "vscode:prepublish": "npm run package-web",
+    "compile-web": "webpack",
+    "watch-web": "webpack --watch",
+    "package-web": "webpack --mode production --devtool hidden-source-map",
+    "lint": "eslint src --ext ts"
   },
   "contributes": {
     "languages": [
@@ -53,7 +59,18 @@
     "workspaceContains:**/*.hcl"
   ],
   "devDependencies": {
-    "vscode": "^1.1.37"
+    "@types/vscode": "^1.59.0",
+    "eslint": "^7.32.0",
+    "@typescript-eslint/eslint-plugin": "^4.31.1",
+    "@typescript-eslint/parser": "^4.31.1",
+    "typescript": "^4.4.3",
+    "@vscode/test-web": "^0.0.12",
+    "ts-loader": "^9.2.5",
+    "webpack": "^5.52.1",
+    "webpack-cli": "^4.8.0",
+    "@types/webpack-env": "^1.16.2",
+    "assert": "^2.0.0",
+    "process": "^0.11.10"
   },
   "bugs": "https://github.com/avenga/couper-vscode/issues",
   "repository": {

src/completion.js

@@ -1,8 +1,8 @@
 "use strict"
 
 const vscode = require('vscode')
-const common = require('./common')
-const { attributes, blocks, functions, variables, DEFAULT_LABEL } = require('./schema')
+const common = require('common')
+const { attributes, blocks, functions, variables, DEFAULT_LABEL } = require('schema')
 
 const selector = { language: 'couper' }
 

src/definition.js

@@ -1,7 +1,7 @@
 "use strict"
 
 const vscode = require('vscode')
-const common = require('./common')
+const common = require('common')
 
 const selector = { language: 'couper' }
 

src/extension.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, "__esModule", { value: true })
 
-const Completion = require("./completion")
-const Definition = require("./definition")
+const Completion = require("completion")
+const Definition = require("definition")
 
 exports.activate = (context) => {
 	context.subscriptions.concat(Completion.providers, Definition.providers)

webpack.config.js

@@ -0,0 +1,62 @@
+const path = require('path');
+const webpack = require('webpack');
+
+/** @typedef {import('webpack').Configuration} WebpackConfig **/
+/** @type WebpackConfig */
+const webExtensionConfig = {
+    mode: 'none', // this leaves the source code as close as possible to the original (when packaging we set this to 'production')
+    target: 'webworker', // extensions run in a webworker context
+    entry: {
+        extension: './src/extension.js', // source of the web extension main file
+    },
+    output: {
+        filename: '[name].js',
+        path: path.join(__dirname, './dist/web'),
+        libraryTarget: 'commonjs',
+        devtoolModuleFilenameTemplate: '../../[resource-path]'
+    },
+    resolve: {
+        mainFields: ['browser', 'module', 'main'], // look for `browser` entry point in imported node modules
+        extensions: ['.ts', '.js'], // support ts-files and js-files
+        alias: {
+            // provides alternate implementation for node module and source files
+            common: path.resolve(__dirname,'src/common.js'),
+            completion: path.resolve(__dirname,'src/completion.js'),
+            definition: path.resolve(__dirname,'src/definition.js'),
+            extension: path.resolve(__dirname,'src/extension.js'),
+            schema: path.resolve(__dirname,'src/schema.js'),
+        },
+        fallback: {
+            // Webpack 5 no longer polyfills Node.js core modules automatically.
+            // see https://webpack.js.org/configuration/resolve/#resolvefallback
+            // for the list of Node.js core module polyfills.
+            assert: require.resolve('assert')
+        }
+    },
+    module: {
+        rules: [
+            {
+                test: /\.ts$/,
+                exclude: /node_modules/,
+                use: [
+                    {
+                        loader: 'ts-loader'
+                    }
+                ]
+            }
+        ]
+    },
+    plugins: [
+        new webpack.ProvidePlugin({
+            process: 'process/browser' // provide a shim for the global `process` variable
+        })
+    ],
+    externals: {
+        vscode: 'commonjs vscode' // ignored because it doesn't exist
+    },
+    performance: {
+        hints: false
+    },
+    devtool: 'nosources-source-map' // create a source map that points to the original source file
+};
+module.exports = [webExtensionConfig];