Merge pull request #2 from JennieJi/fix-release

Fix release, replace dynamic loading parser, pack source

.vscode/tasks.json

@@ -6,7 +6,7 @@
     {
       "type": "shell",
       "label": "Build",
-      "command": "yarn run compile",
+      "command": "yarn run dev",
       "problemMatcher": "$tsc-watch",
       "isBackground": true,
       "presentation": {

.vscodeignore

@@ -2,9 +2,14 @@
 .vscode-test/**
 out/test/**
 src/**
+.eslintrc
 .gitignore
+.prettierrc
 **/tsconfig.json
 **/.eslintrc.json
 **/*.map
 **/*.ts
-**/*.log
+**/*.log
+node_modules/**
+*.lock
+webpack.config.js

CHANGELOG.md

@@ -4,6 +4,10 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+#### [v0.1.1](https://github.com/JennieJi/vscode-babel-ast-explorer/compare/vv0.1.0...vv0.1.1)
+
+> 25 May 2020
+
 #### v0.1.0
 
 > 25 May 2020

package.json

@@ -8,7 +8,7 @@
     "name": "Jennie Ji",
     "email": "[email protected]"
   },
-  "version": "0.1.1",
+  "version": "0.1.3",
   "license": "MIT",
   "engines": {
     "vscode": "^1.42.0"
@@ -74,9 +74,11 @@
     "startingVersion": "v0.1.0"
   },
   "scripts": {
-    "vscode:prepublish": "yarn changelog && yarn run compile",
+    "vscode:prepublish": "yarn fetch:parser && yarn changelog && yarn run compile",
     "changelog": "auto-changelog && git add CHANGELOG.md",
-    "compile": "tsc -p ./",
+    "fetch:parser": "node ./scripts/fetchParsers.js",
+    "compile": "webpack --mode production -p",
+    "dev": "webpack --mode development -p",
     "lint": "eslint src --ext ts",
     "watch": "tsc -watch -p ./",
     "pretest": "yarn run compile && yarn run lint",
@@ -98,9 +100,15 @@
     "eslint-plugin-prettier": "^3.1.3",
     "glob": "^7.1.6",
     "mocha": "^7.1.0",
+    "pacote": "^11.1.10",
     "prettier": "^2.0.5",
+    "shebang-loader": "^0.0.1",
+    "ts-loader": "^7.0.5",
+    "ts-node": "^8.10.1",
     "typescript": "^3.7.5",
-    "vscode-test": "^1.3.0"
+    "vscode-test": "^1.3.0",
+    "webpack": "^4.43.0",
+    "webpack-cli": "^3.3.11"
   },
   "repository": {
     "type": "git",
@@ -110,7 +118,6 @@
     "url": "https://github.com/JennieJi/vscode-babel-ast-explorer/issues"
   },
   "dependencies": {
-    "pacote": "^11.1.10",
     "semver": "^7.3.2"
   }
 }

scripts/fetchParsers.js

@@ -0,0 +1,27 @@
+const { packument, extract } = require('pacote');
+const semver = require('semver');
+const path = require('path');
+
+const PACKAGE = '@babel/parser';
+
+function parserPath(version = '') {
+  return path.resolve(__dirname, '../resources', PACKAGE, version);
+}
+
+async function getParserVersions() {
+  const data = await packument(PACKAGE);
+  return semver.rsort(Object.values(data.versions).map((d) => d.version));
+}
+
+function resolveVersion(version = 'latest') {
+  const spec = `${PACKAGE}@${version}`;
+  const dist = parserPath(version);
+  return extract(spec, dist).then((res) => {
+    console.log(`fetched ${spec} -> ${dist}`);
+    return res;
+  });
+}
+
+getParserVersions().then((versions) =>
+  Promise.all(versions.map(resolveVersion))
+);

src/MultiOptionsProvider.ts

@@ -32,13 +32,14 @@ class MultiOptionsProvider implements vscode.TreeDataProvider<OptionNode> {
   public getTreeItem({ label, value }: OptionNode): vscode.TreeItem {
     const isEnabled = this.enabledOptions.includes(value);
     const enabled = this.enabledOptions;
+    const iconPath = path.resolve(
+      __ASSET_PATH__,
+      isEnabled ? 'icons/green-tick.svg' : 'icons/grey-tick.svg'
+    );
     return {
       label,
       id: value,
-      iconPath: path.resolve(
-        __dirname,
-        isEnabled ? 'icons/green-tick.svg' : 'icons/grey-tick.svg'
-      ),
+      iconPath,
       command: {
         command: COMMANDS.update,
         arguments: [

src/SingleOptionProvider.ts

@@ -27,13 +27,14 @@ class SingleOptionProvider implements vscode.TreeDataProvider<OptionNode> {
 
   public getTreeItem({ label, value }: OptionNode): vscode.TreeItem {
     const isEnabled = this.enabled === value;
+    const iconPath = path.resolve(
+      __ASSET_PATH__,
+      isEnabled ? 'icons/green-tick.svg' : 'icons/grey-tick.svg'
+    );
     return {
       label,
       id: value,
-      iconPath: path.resolve(
-        __dirname,
-        isEnabled ? 'icons/green-tick.svg' : 'icons/grey-tick.svg'
-      ),
+      iconPath,
       command: {
         command: COMMANDS.update,
         arguments: [

src/astView.ts

@@ -77,7 +77,12 @@ class ASTView {
     this.panel.title = this.getTitle();
     this.panel.webview.html = 'Loading...';
     this.codeVersion = this.getVersion();
-    this.panel.webview.html = await this.getWebviewContent();
+    const content = await this.getWebviewContent();
+    if (content) {
+      this.panel.webview.html = content;
+    } else {
+      this.panel.webview.html = 'Error: empty content';
+    }
   }
 
   private async getWebviewContent() {

src/optionsView.ts

@@ -39,21 +39,20 @@ class OptionsView {
       ),
     };
 
-    getParserVersions().then((versions) => {
-      this.viewers.version = this.registerView(
-        'babelAstExplorer-versions',
-        new SingleOptionProvider(
-          {
-            key: 'version',
-            items: versions.map((v) => ({
-              label: v,
-              value: v,
-            })),
-          },
-          versions[0]
-        )
-      );
-    });
+    const versions = getParserVersions();
+    this.viewers.version = this.registerView(
+      'babelAstExplorer-versions',
+      new SingleOptionProvider(
+        {
+          key: 'version',
+          items: versions.map((v) => ({
+            label: v,
+            value: v,
+          })),
+        },
+        versions[0]
+      )
+    );
   }
 
   registerView(

src/parserVersion.ts

@@ -1,23 +1,23 @@
-import { packument, extract } from 'pacote';
 import * as semver from 'semver';
 import * as path from 'path';
+import * as fs from 'fs';
 
 const PACKAGE = '@babel/parser';
 
-export async function getParserVersions() {
-  const data = await packument(PACKAGE);
-  return semver.rsort(Object.values(data.versions).map((d) => d.version));
+function parserPath(version = '') {
+  return path.resolve(__ASSET_PATH__, PACKAGE, version);
 }
 
-export function parserPath(version: string) {
-  const spec = `${PACKAGE}@${version}`;
-  return path.resolve(__dirname, '../resources/', spec);
+export function getParserVersions() {
+  return semver.rsort(fs.readdirSync(parserPath()));
 }
 
-export async function resolveVersion(version = 'latest') {
-  const spec = `${PACKAGE}@${version}`;
-  const dist = parserPath(version);
-  await extract(spec, dist);
-  const pkg = require(path.resolve(dist, 'package.json'));
-  return require(path.resolve(dist, pkg.main));
+export async function resolveVersion(version?: string) {
+  if (!version) {
+    version = getParserVersions()[0];
+  }
+  const pkg = await import(
+    `${__ASSET_PATH__}/${PACKAGE}/${version}/package.json`
+  );
+  return await import(`${__ASSET_PATH__}/${PACKAGE}/${version}/${pkg.main}`);
 }

src/simpleTemplate.ts

@@ -12,7 +12,7 @@ function getTemplate(templatename: string) {
   if (!templateCache[templatename]) {
     const raw = fs
       .readFileSync(
-        path.resolve(__dirname, '../resources/templates', templatename),
+        path.resolve(__ASSET_PATH__, 'templates', templatename),
         'utf-8'
       )
       .toString();

src/types.ts

@@ -0,0 +1 @@
+declare var __ASSET_PATH__: string;

tsconfig.json

@@ -5,13 +5,14 @@
     "outDir": "out",
     "lib": ["es6"],
     "sourceMap": true,
-    "rootDir": "src",
+    "rootDir": ".",
     "strict": true /* enable all strict type-checking options */,
     "resolveJsonModule": true
     /* 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. */
   },
+  "include": ["src", "resources"],
   "exclude": ["node_modules", ".vscode-test"]
 }

webpack.config.js

@@ -0,0 +1,65 @@
+'use strict';
+
+const path = require('path');
+const webpack = require('webpack');
+
+const ASSET_PATH = path.resolve(__dirname, 'resources');
+
+/**@type {import('webpack').Configuration}*/
+const config = {
+  target: 'node', // vscode extensions run in a Node.js-context 📖 -> https://webpack.js.org/configuration/node/
+
+  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, 'out'),
+    publicPath: path.resolve(__dirname, 'resources'),
+    filename: 'extension.js',
+    libraryTarget: 'commonjs2',
+    devtoolModuleFilenameTemplate: '../[resource-path]',
+  },
+  devtool: 'source-map',
+  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/,
+    },
+    function (context, request, callback) {
+      if (/@babel\/parser/.test(request)) {
+        return callback(null, path.resolve(ASSET_PATH, request));
+      }
+      callback();
+    },
+  ],
+  resolve: {
+    // support reading TypeScript and JavaScript files, 📖 -> https://github.com/TypeStrong/ts-loader
+    extensions: ['.ts', '.js', '.json'],
+  },
+  module: {
+    rules: [
+      {
+        test: /\.js$/,
+        include: /bin/,
+        use: [
+          {
+            loader: 'shebang-loader',
+          },
+        ],
+      },
+      {
+        test: /\.ts$/,
+        exclude: /node_modules|\.vscode-test/,
+        use: [
+          {
+            loader: 'ts-loader',
+          },
+        ],
+      },
+    ],
+  },
+  plugins: [
+    new webpack.DefinePlugin({
+      __ASSET_PATH__: JSON.stringify(ASSET_PATH),
+    }),
+  ],
+};
+module.exports = config;