Skip to content

Commit

Permalink
Add webpack for extension bundling (#471)
Browse files Browse the repository at this point in the history
* update extension to use webpack for compilation

* update webpack related scripts and settings

* update changelog

* fix excluding external jest-config

* ignore .vsix files
  • Loading branch information
stephtr authored and connectdotz committed Jun 23, 2019
1 parent 21640e2 commit 4af6c07
Show file tree
Hide file tree
Showing 11 changed files with 1,560 additions and 103 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -6,3 +6,4 @@ node_modules/
out/

**/.DS_Store
*.vsix
56 changes: 29 additions & 27 deletions .vscode/launch.json
Original file line number Diff line number Diff line change
@@ -1,29 +1,31 @@
// A launch configuration that compiles the extension and then opens it inside a new window
{
"version": "0.1.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Debug Tests",
"program": "${workspaceRoot}/node_modules/jest/bin/jest.js",
"cwd": "${workspaceRoot}",
"args": [
"--i",
"--config",
"jest.json"
]
},
{
"name": "Launch Extension",
"type": "extensionHost",
"request": "launch",
"runtimeExecutable": "${execPath}",
"args": ["--extensionDevelopmentPath=${workspaceRoot}" ],
"stopOnEntry": false,
"sourceMaps": true,
"outDir": "${workspaceRoot}/out/src",
"preLaunchTask": "npm"
}
]
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Debug Tests",
"program": "${workspaceRoot}/node_modules/jest/bin/jest.js",
"cwd": "${workspaceRoot}",
"args": ["--i", "--config", "jest.json"]
},
{
"name": "Launch Extension (development)",
"type": "extensionHost",
"request": "launch",
"runtimeExecutable": "${execPath}",
"args": ["--extensionDevelopmentPath=${workspaceFolder}"],
"outFiles": ["${workspaceFolder}/out/**/*.js"],
"preLaunchTask": "watch"
},
{
"name": "Launch Extension (production)",
"type": "extensionHost",
"request": "launch",
"runtimeExecutable": "${execPath}",
"args": ["--extensionDevelopmentPath=${workspaceFolder}"],
"outFiles": ["${workspaceFolder}/out/**/*.js"],
"preLaunchTask": "npm: compile"
}
]
}
57 changes: 28 additions & 29 deletions .vscode/tasks.json
Original file line number Diff line number Diff line change
@@ -1,30 +1,29 @@
// Available variables which can be used inside of strings.
// ${workspaceRoot}: the root folder of the team
// ${file}: the current opened file
// ${fileBasename}: the current opened file's basename
// ${fileDirname}: the current opened file's dirname
// ${fileExtname}: the current opened file's extension
// ${cwd}: the current working directory of the spawned process

// A task runner that calls a custom npm script that compiles the extension.
{
"version": "0.1.0",

// we want to run npm
"command": "npm",

// the command is a shell script
"isShellCommand": true,

// show the output window only if unrecognized errors occur.
"showOutput": "silent",

// we run the custom script "compile" as defined in package.json
"args": ["run", "compile", "--loglevel", "silent"],

// The tsc compiler is started in watching mode
"isWatching": true,

// use the standard tsc in watch mode problem matcher to find compile problems in the output.
"problemMatcher": "$tsc-watch"
}
"version": "2.0.0",
"tasks": [
{
"label": "watch",
"type": "npm",
"script": "watch",
"isBackground": true,
"problemMatcher": [
{
"owner": "custom",
"pattern": [
{
"regexp": "^PATTERN WON'T MATCH, BUT NEEDED TO BE A VALID PROBLEM MATCHER$",
"file": 1,
"location": 2,
"message": 3
}
],
"background": {
"activeOnStart": true,
"beginsPattern": "^Compilation\\s+starting",
"endsPattern": "^Compilation\\s+finished"
}
}
]
}
]
}
5 changes: 4 additions & 1 deletion .vscodeignore
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ src/**
**/*.map
.gitignore
tsconfig.json
vsc-extension-quickstart.md
integrations/**
**/__mocks__/**
**/tests/**
Expand All @@ -18,3 +17,7 @@ yarn.lock
yarn-error.log
scripts/
coverage
.github/**
images/**
!images/vscode-jest.png
webpack.config.js
2 changes: 2 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,8 @@ Bug-fixes within the same version aren't needed

* replaced deprecated vscode.previewHtml command with webview - qalex

* use webpack for compilation, resulting in a much smaller extension size - stephtr

### 2.9.1

* Prevent ANSI escape codes from appearing in test messages - seanpoulter
Expand Down
30 changes: 16 additions & 14 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@
"workspaceContains:node_modules/react-native-scripts",
"onCommand:io.orta.jest.start"
],
"main": "./out/src/extension",
"main": "./out/extension",
"icon": "images/vscode-jest.png",
"contributes": {
"languages": [
Expand Down Expand Up @@ -233,11 +233,12 @@
"precommit": "lint-staged",
"ci": "yarn lint && yarn test --coverage",
"clean-out": "rimraf ./out",
"vscode:prepublish": "yarn clean-out && tsc -p ./tsconfig.publish.json",
"compile": "tsc -watch -p ./tsconfig.publish.json",
"vscode:prepublish": "yarn clean-out && yarn compile",
"compile": "webpack --mode production",
"watch": "webpack --mode development --watch --info-verbosity verbose",
"lint": "tslint -c tslint.json 'src/**/*.ts' 'tests/**/*.ts'",
"postinstall": "node ./node_modules/vscode/bin/install",
"test": "tsc && jest",
"test": "jest",
"watch-test": "yarn test -- --watch",
"prettier": "prettier",
"prettier-write": "yarn prettier --parser typescript --no-semi --single-quote --trailing-comma es5 --write --print-width 120",
Expand All @@ -248,26 +249,27 @@
"@types/node": "^8.0.31",
"coveralls": "^3.0.0",
"danger": "^2",
"elegant-spinner": "^1.0.1",
"glob": "^7.1.1",
"husky": "^0.14.3",
"istanbul-lib-coverage": "^1.1.1",
"istanbul-lib-source-maps": "^1.1.0",
"jest": "^24.7.0",
"jest-editor-support": "^26.0.0-beta",
"jest-snapshot": "^24.7.0",
"lint-staged": "^4.2.3",
"micromatch": "^2.3.11",
"prettier": "^1.17.0",
"rimraf": "^2.6.2",
"ts-jest": "^24.0.2",
"ts-loader": "^6.0.4",
"tslint": "^5.16.0",
"tslint-config-prettier": "^1.18.0",
"typescript": "^3.4.3",
"typescript-tslint-plugin": "^0.3.1"
},
"dependencies": {
"elegant-spinner": "^1.0.1",
"istanbul-lib-coverage": "^1.1.1",
"istanbul-lib-source-maps": "^1.1.0",
"jest-editor-support": "^26.0.0-beta",
"jest-snapshot": "^24.7.0",
"micromatch": "^2.3.11",
"vscode": "^1.1.33"
"typescript-tslint-plugin": "^0.3.1",
"vscode": "^1.1.33",
"webpack": "^4.35.0",
"webpack-cli": "^3.3.4"
},
"__metadata": {
"id": "7997a8ae-1fae-4022-b834-12f6318aeffd",
Expand Down
2 changes: 1 addition & 1 deletion tsconfig.json
Original file line number Diff line number Diff line change
Expand Up @@ -20,5 +20,5 @@
}
]
},
"exclude": ["integrations", "__mocks__"]
"exclude": ["integrations", "__mocks__", "node_modules"]
}
8 changes: 0 additions & 8 deletions tsconfig.publish.json

This file was deleted.

3 changes: 2 additions & 1 deletion tslint.json
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
"member-access": false,
"interface-name": false,
"no-empty": [true, "allow-empty-catch", "allow-empty-functions"],
"no-this-assignment": [true, { "allow-destructuring": true }]
"no-this-assignment": [true, { "allow-destructuring": true }],
"no-implicit-dependencies": [true, "dev"]
}
}
49 changes: 49 additions & 0 deletions webpack.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
//@ts-check

'use strict';

const path = require('path');

/**@returns {import('webpack').Configuration}*/
module.exports = (env, argv) => {
const isProduction = argv.mode === 'production';
const isDevelopment = !isProduction;

/**@type {any} */
const externals = [
{'jest-config': 'root {}'}, // the jest-config module isn't utilized in this plugin, compiling it would result in unnecessary overhead and errors
{ 'vscode': 'commonjs vscode' } // the vscode-module is created on-the-fly and must be excluded.
];

// during development keep the largest external dependencies out of the bundle in order to speed up build time
if (isDevelopment) {
externals.push('typescript', /^\@babel\/.*/, 'babylon');
}
return {
context: __dirname,
target: 'node',
entry: './src/extension.ts',
output: {
path: path.resolve(__dirname, 'out'),
filename: 'extension.js',
libraryTarget: 'commonjs2',
devtoolModuleFilenameTemplate: '../[resource-path]'
},
devtool: 'source-map',
externals,
resolve: {
extensions: ['.ts', '.js']
},
module: {
rules: [
{
test: /\.ts$/,
exclude: /node_modules/,
use: [
{ loader: 'ts-loader' }
]
}
]
}
};
};
Loading

0 comments on commit 4af6c07

Please sign in to comment.