From f5c40bf9771cdf611fa964bc67dcc9bbe52ba8c7 Mon Sep 17 00:00:00 2001 From: fisker Cheung Date: Fri, 17 Jul 2020 09:07:26 +0800 Subject: [PATCH] Auto generate parsers for playground (#8771) --- scripts/build-docs.js | 32 ++++++- website/static/service-worker.js | 17 ++-- website/static/worker.js | 154 ++++--------------------------- 3 files changed, 56 insertions(+), 147 deletions(-) diff --git a/scripts/build-docs.js b/scripts/build-docs.js index 8c67bd5b1..a9b6b8924 100644 --- a/scripts/build-docs.js +++ b/scripts/build-docs.js @@ -3,7 +3,10 @@ "use strict"; const path = require("path"); +const fs = require("fs"); const shell = require("shelljs"); +const globby = require("globby"); +const prettier = require("prettier"); shell.config.fatal = true; @@ -15,7 +18,10 @@ function pipe(string) { } const isPullRequest = process.env.PULL_REQUEST === "true"; -const prettierPath = isPullRequest ? "dist" : "node_modules/prettier"; +const prettierPath = path.join( + rootDir, + isPullRequest ? "dist" : "node_modules/prettier" +); shell.mkdir("-p", docs); @@ -27,9 +33,33 @@ if (isPullRequest) { shell.exec("yarn build"); pipe(JSON.stringify(pkg, null, 2) + "\n").to("package.json"); // restore } + shell.cp(`${prettierPath}/standalone.js`, `${docs}/`); shell.cp(`${prettierPath}/parser-*.js`, `${docs}/`); +const parserModules = globby.sync(["parser-*.js"], { cwd: prettierPath }); +const parsers = {}; +for (const file of parserModules) { + const plugin = require(path.join(prettierPath, file)); + const property = file.replace(/\.js$/, "").split("-")[1]; + parsers[file] = { + parsers: Object.keys(plugin.parsers), + property, + }; +} + +fs.writeFileSync( + `${docs}/parsers-location.js`, + prettier.format( + ` + "use strict"; + + const parsersLocation = ${JSON.stringify(parsers)}; + `, + { parser: "babel" } + ) +); + // --- Site --- shell.cd("website"); shell.echo("Building website..."); diff --git a/website/static/service-worker.js b/website/static/service-worker.js index 1fb4f14ee..2a5d4b249 100644 --- a/website/static/service-worker.js +++ b/website/static/service-worker.js @@ -1,23 +1,18 @@ /* eslint-env serviceworker */ -/* global toolbox */ +/* global toolbox parsersLocation */ "use strict"; +importScripts("lib/parsers-location.js"); importScripts("https://unpkg.com/sw-toolbox@3.6.0/sw-toolbox.js"); +const parsers = Object.keys(parsersLocation).map((file) => `lib/${file}`); + toolbox.precache([ // Scripts "lib/standalone.js", - "lib/parser-angular.js", - "lib/parser-babel.js", - "lib/parser-flow.js", - "lib/parser-glimmer.js", - "lib/parser-graphql.js", - "lib/parser-html.js", - "lib/parser-markdown.js", - "lib/parser-postcss.js", - "lib/parser-typescript.js", - "lib/parser-yaml.js", + "lib/parsers-location.js", + ...parsers, "playground.js", "https://unpkg.com/sw-toolbox@3.6.0/sw-toolbox.js", diff --git a/website/static/worker.js b/website/static/worker.js index a44cc4012..32472a22c 100644 --- a/website/static/worker.js +++ b/website/static/worker.js @@ -1,6 +1,6 @@ /* eslint-env worker */ /* eslint no-var: off, strict: off */ -/* globals prettier prettierPlugins */ +/* globals prettier prettierPlugins parsersLocation */ var imported = Object.create(null); function importScriptOnce(url) { @@ -10,141 +10,25 @@ function importScriptOnce(url) { } } -// this is required to only load parsers when we need them -var parsers = { - // JS - Babel - get babel() { - importScriptOnce("lib/parser-babel.js"); - return prettierPlugins.babel.parsers.babel; - }, - get "babel-flow"() { - importScriptOnce("lib/parser-babel.js"); - return prettierPlugins.babel.parsers["babel-flow"]; - }, - get "babel-ts"() { - importScriptOnce("lib/parser-babel.js"); - return prettierPlugins.babel.parsers["babel-ts"]; - }, - get json() { - importScriptOnce("lib/parser-babel.js"); - return prettierPlugins.babel.parsers.json; - }, - get json5() { - importScriptOnce("lib/parser-babel.js"); - return prettierPlugins.babel.parsers.json5; - }, - get "json-stringify"() { - importScriptOnce("lib/parser-babel.js"); - return prettierPlugins.babel.parsers["json-stringify"]; - }, - get __js_expression() { - importScriptOnce("lib/parser-babel.js"); - return prettierPlugins.babel.parsers.__js_expression; - }, - get __vue_expression() { - importScriptOnce("lib/parser-babel.js"); - return prettierPlugins.babel.parsers.__vue_expression; - }, - get __vue_event_binding() { - importScriptOnce("lib/parser-babel.js"); - return prettierPlugins.babel.parsers.__vue_event_binding; - }, - // JS - Flow - get flow() { - importScriptOnce("lib/parser-flow.js"); - return prettierPlugins.flow.parsers.flow; - }, - // JS - TypeScript - get typescript() { - importScriptOnce("lib/parser-typescript.js"); - return prettierPlugins.typescript.parsers.typescript; - }, - // JS - Angular Action - get __ng_action() { - importScriptOnce("lib/parser-angular.js"); - return prettierPlugins.angular.parsers.__ng_action; - }, - // JS - Angular Binding - get __ng_binding() { - importScriptOnce("lib/parser-angular.js"); - return prettierPlugins.angular.parsers.__ng_binding; - }, - // JS - Angular Interpolation - get __ng_interpolation() { - importScriptOnce("lib/parser-angular.js"); - return prettierPlugins.angular.parsers.__ng_interpolation; - }, - // JS - Angular Directive - get __ng_directive() { - importScriptOnce("lib/parser-angular.js"); - return prettierPlugins.angular.parsers.__ng_directive; - }, - - // CSS - get css() { - importScriptOnce("lib/parser-postcss.js"); - return prettierPlugins.postcss.parsers.css; - }, - get less() { - importScriptOnce("lib/parser-postcss.js"); - return prettierPlugins.postcss.parsers.css; - }, - get scss() { - importScriptOnce("lib/parser-postcss.js"); - return prettierPlugins.postcss.parsers.css; - }, - - // GraphQL - get graphql() { - importScriptOnce("lib/parser-graphql.js"); - return prettierPlugins.graphql.parsers.graphql; - }, - - // Markdown - get markdown() { - importScriptOnce("lib/parser-markdown.js"); - return prettierPlugins.markdown.parsers.remark; - }, - get mdx() { - importScriptOnce("lib/parser-markdown.js"); - return prettierPlugins.markdown.parsers.mdx; - }, - - // YAML - get yaml() { - importScriptOnce("lib/parser-yaml.js"); - return prettierPlugins.yaml.parsers.yaml; - }, - - // Handlebars - get glimmer() { - importScriptOnce("lib/parser-glimmer.js"); - return prettierPlugins.glimmer.parsers.glimmer; - }, - - // HTML - get html() { - importScriptOnce("lib/parser-html.js"); - return prettierPlugins.html.parsers.html; - }, - // Vue - get vue() { - importScriptOnce("lib/parser-html.js"); - return prettierPlugins.html.parsers.vue; - }, - // Angular - get angular() { - importScriptOnce("lib/parser-html.js"); - return prettierPlugins.html.parsers.angular; - }, - // Lightning Web Components - get lwc() { - importScriptOnce("lib/parser-html.js"); - return prettierPlugins.html.parsers.lwc; - }, -}; - +importScripts("lib/parsers-location.js"); importScripts("lib/standalone.js"); + +// this is required to only load parsers when we need them +const parsers = Object.create(null); + +for (const file in parsersLocation) { + const { parsers: moduleParsers, property } = parsersLocation[file]; + const url = `lib/${file}`; + for (const parserName of moduleParsers) { + Object.defineProperty(parsers, parserName, { + get() { + importScriptOnce(url); + return prettierPlugins[property].parsers[parserName]; + }, + }); + } +} + // eslint-disable-next-line no-unused-vars var PRETTIER_DEBUG = true;