Skip to content

Commit

Permalink
Web support (prettier#2203)
Browse files Browse the repository at this point in the history
Support for web version of VS Code

Co-authored-by: Martin Aeschlimann <[email protected]>
  • Loading branch information
ntotten and aeschli authored Sep 20, 2021
1 parent 413f24e commit c75c9d3
Show file tree
Hide file tree
Showing 18 changed files with 1,461 additions and 189 deletions.
1 change: 1 addition & 0 deletions .github/ISSUE_TEMPLATE/Bug_report.md
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@ _Describe what actually happened instead_.
_Feel free to attach a screenshot_.

**VS Code Version**:

<!-- In VS Code select "Help" > "About", then click on "Copy" and paste the text here -->

**Prettier Extension Version**:
Expand Down
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ out
dist
node_modules
.vscode-test
.vscode-test-web
*.vsix
.DS_STORE
*.log
Expand Down
12 changes: 12 additions & 0 deletions .vscode/launch.json
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,18 @@
],
"outFiles": ["${workspaceFolder}/out/test/**/*.js"],
"preLaunchTask": "npm: test-compile"
},
{
"name": "Run Web Extension",
"type": "pwa-extensionHost",
"debugWebWorkerHost": true,
"request": "launch",
"args": [
"--extensionDevelopmentPath=${workspaceFolder}",
"--extensionDevelopmentKind=web"
],
"outFiles": ["${workspaceFolder}/dist/**/*.js"],
"preLaunchTask": "npm: webpack"
}
]
}
1 change: 1 addition & 0 deletions .vscodeignore
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
.husky/
.vscode/
.vscode-test/
.vscode-test-web/
out/
scripts/
src/
Expand Down
8 changes: 7 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,7 @@
],
"icon": "icon.png",
"main": "./dist/extension",
"browser": "./dist/web-extension",
"scripts": {
"clean": "node ./scripts/clean.js",
"lint": "eslint -c .eslintrc.js --ext .ts .",
Expand All @@ -72,7 +73,8 @@
"watch": "tsc --watch -p ./",
"webpack-dev": "webpack --mode development --watch",
"webpack": "webpack --mode development",
"postinstall": "husky install"
"postinstall": "husky install",
"chrome": "yarn webpack && vscode-test-web --browserType=chromium --extensionDevelopmentPath=. ."
},
"lint-staged": {
"**/*.{ts,json,md,yml,js}": [
Expand All @@ -97,17 +99,21 @@
"@typescript-eslint/eslint-plugin": "^4.31.1",
"@typescript-eslint/parser": "^4.31.1",
"@vscode/test-electron": "^1.6.2",
"@vscode/test-web": "^0.0.11",
"eslint": "^7.32.0",
"eslint-config-prettier": "^8.1.0",
"fs-extra": "^10.0.0",
"glob": "^7.1.6",
"husky": "^7.0.2",
"lint-staged": "^11.1.2",
"mocha": "^9.1.1",
"path-browserify": "^1.0.1",
"process": "^0.11.10",
"sinon": "^11.1.2",
"tmp": "^0.2.1",
"ts-loader": "^9.2.5",
"typescript": "^4.4.3",
"util": "^0.12.4",
"vsce": "^1.80.0",
"vscode-nls-dev": "^3.3.2",
"webpack": "^5.53.0",
Expand Down
176 changes: 176 additions & 0 deletions src/BrowserModuleResolver.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,176 @@
import {
PrettierFileInfoOptions,
PrettierFileInfoResult,
PrettierSupportLanguage,
PrettierModule,
PrettierOptions,
ModuleResolverInterface,
PrettierVSCodeConfig,
} from "./types";

import * as prettierStandalone from "prettier/standalone";

import * as angularPlugin from "prettier/parser-angular";
import * as babelPlugin from "prettier/parser-babel";
import * as glimmerPlugin from "prettier/parser-glimmer";
import * as graphqlPlugin from "prettier/parser-graphql";
import * as htmlPlugin from "prettier/parser-html";
import * as markdownPlugin from "prettier/parser-markdown";
import * as meriyahPlugin from "prettier/parser-meriyah";
import * as typescriptPlugin from "prettier/parser-typescript";
import * as yamlPlugin from "prettier/parser-yaml";

// commente out as the cod uses `new Function("return this") which
// is not allowed in the VS Code extension host as it enforces
// the Trusted Types Content Security Policy
//import * as flowPlugin from "prettier/parser-flow";
//import * as postcssPlugin from "prettier/parser-postcss";

import { TextDocument } from "vscode";
import { LoggingService } from "./LoggingService";

const plugins = [
angularPlugin,
babelPlugin,
glimmerPlugin,
graphqlPlugin,
htmlPlugin,
markdownPlugin,
meriyahPlugin,
typescriptPlugin,
yamlPlugin,
];

export class ModuleResolver implements ModuleResolverInterface {
constructor(private loggingService: LoggingService) {}

public async getPrettierInstance(
// eslint-disable-next-line @typescript-eslint/no-unused-vars
_fileName: string
): Promise<PrettierModule | undefined> {
return this.getGlobalPrettierInstance();
}

public getGlobalPrettierInstance(): PrettierModule {
this.loggingService.logInfo("Using standalone prettier");
return {
format: (source: string, options: PrettierOptions) => {
return prettierStandalone.format(source, { ...options, plugins });
},
getSupportInfo: (): { languages: PrettierSupportLanguage[] } => {
return {
languages: [
{
vscodeLanguageIds: ["javascript", "mongo", "javascriptreact"],
extensions: [],
parsers: [
"babel",
"espree",
"meriyah",
"babel-flow",
"babel-ts",
"flow",
"typescript",
],
},
{
vscodeLanguageIds: ["typescript"],
extensions: [],
parsers: ["typescript", "babel-ts"],
},
{
vscodeLanguageIds: ["typescriptreact"],
extensions: [],
parsers: ["typescript", "babel-ts"],
},
{
vscodeLanguageIds: ["json"],
extensions: [],
parsers: ["json-stringify"],
},
{
vscodeLanguageIds: ["json"],
extensions: [],
parsers: ["json"],
},
{
vscodeLanguageIds: ["jsonc"],
parsers: ["json"],
},
{
vscodeLanguageIds: ["json5"],
extensions: [],
parsers: ["json5"],
},
{
vscodeLanguageIds: ["handlebars"],
extensions: [],
parsers: ["glimmer"],
},
{
vscodeLanguageIds: ["graphql"],
extensions: [],
parsers: ["graphql"],
},
{
vscodeLanguageIds: ["markdown"],
parsers: ["markdown"],
},
{
vscodeLanguageIds: ["mdx"],
extensions: [],
parsers: ["mdx"],
},
{
vscodeLanguageIds: ["html"],
extensions: [],
parsers: ["angular"],
},
{
vscodeLanguageIds: ["html"],
extensions: [],
parsers: ["html"],
},
{
vscodeLanguageIds: ["html"],
extensions: [],
parsers: ["lwc"],
},
{
vscodeLanguageIds: ["vue"],
extensions: [],
parsers: ["vue"],
},
{
vscodeLanguageIds: ["yaml", "ansible", "home-assistant"],
extensions: [],
parsers: ["yaml"],
},
],
};
},
getFileInfo: async (
// eslint-disable-next-line @typescript-eslint/no-unused-vars
filePath: string,
// eslint-disable-next-line @typescript-eslint/no-unused-vars
options?: PrettierFileInfoOptions
): Promise<PrettierFileInfoResult> => {
// TODO: implement ignore file reading
return { ignored: false, inferredParser: null };
},
};
}

async getResolvedConfig(
// eslint-disable-next-line @typescript-eslint/no-unused-vars
_doc: TextDocument,
// eslint-disable-next-line @typescript-eslint/no-unused-vars
_vscodeConfig: PrettierVSCodeConfig
): Promise<"error" | "disabled" | PrettierOptions | null> {
return null;
}

dispose() {
// nothing to do
}
}
13 changes: 7 additions & 6 deletions src/LoggingService.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import * as prettier from "prettier";
import { window } from "vscode";

type LogLevel = "DEBUG" | "INFO" | "WARN" | "ERROR" | "NONE";
Expand Down Expand Up @@ -92,11 +91,13 @@ export class LoggingService {
}

private logObject(data: unknown): void {
const message = prettier
.format(JSON.stringify(data, null, 2), {
parser: "json",
})
.trim();
// const message = JSON.parser
// .format(JSON.stringify(data, null, 2), {
// parser: "json",
// })
// .trim();
const message = JSON.stringify(data, null, 2); // dont use prettrer to keep it simple

this.outputChannel.appendLine(message);
}

Expand Down
Loading

0 comments on commit c75c9d3

Please sign in to comment.