workflow: upgrade scripts and settings

.vscode/launch.json

@@ -0,0 +1,25 @@
+{
+  // Use IntelliSense to learn about possible attributes.
+  // Hover to view descriptions of existing attributes.
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "Jest",
+      "type": "node",
+      "request": "launch",
+      "program": "${workspaceFolder}/scripts/jest.js",
+      "stopOnEntry": false,
+      "args": ["${fileBasename}", "--runInBand", "--detectOpenHandles"],
+      "cwd": "${workspaceFolder}",
+      "preLaunchTask": null,
+      "runtimeExecutable": null,
+      "runtimeArgs": ["--nolazy"],
+      "env": {
+        "NODE_ENV": "development"
+      },
+      "console": "integratedTerminal",
+      "sourceMaps": true
+    }
+  ]
+}

.vscode/settings.json

@@ -0,0 +1,17 @@
+{
+  // Use the project's typescript version
+  "typescript.tsdk": "node_modules/typescript/lib",
+
+  "cSpell.enabledLanguageIds": ["markdown", "plaintext", "text", "yml"],
+
+  // Use prettier to format typescript, javascript and JSON files
+  "[typescript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[javascript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[json]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  }
+}

jest.config.js

@@ -1,7 +1,10 @@
+const lernaJson = require("./lerna.json");
+
 module.exports = {
   preset: "ts-jest",
   globals: {
     __DEV__: true,
+    __VERSION__: lernaJson.version,
     __BROWSER__: false,
     __JSDOM__: true,
     __FEATURE_OPTIONS__: true,

lerna.json

@@ -1,10 +1,8 @@
 {
   "packages": [
-    "catalog", 
-    "theme",
     "packages/*"
   ],
   "npmClient": "yarn",
   "useWorkspaces": true,
-  "version": "independent"
+  "version": "0.1.0"
 }

packages/global.d.ts

@@ -5,6 +5,7 @@ declare var __DEV__: boolean;
 declare var __JSDOM__: boolean;
 declare var __BROWSER__: boolean;
 declare var __COMMIT__: string;
+declare var __VERSION__: string;
 
 // Feature flags
 declare var __FEATURE_OPTIONS__: boolean;

rollup.config.js

@@ -1,10 +1,11 @@
-const fs = require("fs");
-const path = require("path");
-const ts = require("rollup-plugin-typescript2");
-const replace = require("rollup-plugin-replace");
-const alias = require("rollup-plugin-alias");
-const json = require("rollup-plugin-json");
-const peerDepsExternal = require("rollup-plugin-peer-deps-external");
+import fs from "fs";
+import path from "path";
+import ts from "rollup-plugin-typescript2";
+import replace from "rollup-plugin-replace";
+import alias from "rollup-plugin-alias";
+import json from "rollup-plugin-json";
+import lernaJson from "./lerna.json";
+import peerDepsExternal from "rollup-plugin-peer-deps-external";
 
 if (!process.env.TARGET) {
   throw new Error("TARGET package must be specified via --environment flag.");
@@ -70,14 +71,15 @@ if (process.env.NODE_ENV === "production") {
   });
 }
 
-module.exports = packageConfigs;
+export default packageConfigs;
 
 function createConfig(output, plugins = []) {
   const isProductionBuild =
     process.env.__DEV__ === "false" || /\.prod\.js$/.test(output.file);
   const isGlobalBuild = /\.global(\.prod)?\.js$/.test(output.file);
-  const isBunlderESMBuild = /\.esm\.js$/.test(output.file);
+  const isBundlerESMBuild = /\.esm-bundler\.js$/.test(output.file);
   const isBrowserESMBuild = /esm-browser(\.prod)?\.js$/.test(output.file);
+  const isRuntimeCompileBuild = /vue\./.test(output.file);
 
   if (isGlobalBuild) {
     output.name = packageOptions.name;
@@ -125,9 +127,10 @@ function createConfig(output, plugins = []) {
       peerDepsExternal(),
       createReplacePlugin(
         isProductionBuild,
-        isBunlderESMBuild,
+        isBundlerESMBuild,
         (isGlobalBuild || isBrowserESMBuild) &&
-          !packageOptions.enableNonBrowserBranches
+          !packageOptions.enableNonBrowserBranches,
+        isRuntimeCompileBuild
       ),
       ...plugins
     ],
@@ -140,19 +143,27 @@ function createConfig(output, plugins = []) {
   };
 }
 
-function createReplacePlugin(isProduction, isBunlderESMBuild, isBrowserBuild) {
+function createReplacePlugin(
+  isProduction,
+  isBundlerESMBuild,
+  isBrowserBuild,
+  isRuntimeCompileBuild
+) {
   return replace({
     __COMMIT__: `"${process.env.COMMIT}"`,
-    __DEV__: isBunlderESMBuild
+    __VERSION__: `"${lernaJson.version}"`,
+    __DEV__: isBundlerESMBuild
       ? // preserve to be handled by bundlers
         `process.env.NODE_ENV !== 'production'`
       : // hard coded dev/prod builds
         !isProduction,
     // If the build is expected to run directly in the browser (global / esm-browser builds)
     __BROWSER__: isBrowserBuild,
+    // support compile in browser?
+    __RUNTIME_COMPILE__: isRuntimeCompileBuild,
     // support options?
     // the lean build drops options related code with buildOptions.lean: true
-    __FEATURE_OPTIONS__: !packageOptions.lean,
+    __FEATURE_OPTIONS__: !packageOptions.lean && !process.env.LEAN,
     __FEATURE_SUSPENSE__: true,
     // this is only used during tests
     __JSDOM__: false

scripts/build.js

@@ -116,7 +116,7 @@ function checkAllSizes(targets) {
 
 function checkSize(target) {
   const pkgDir = path.resolve(`packages/${target}`);
-  const esmProdBuild = `${pkgDir}/dist/${target}.esm-browser.prod.js`;
+  const esmProdBuild = `${pkgDir}/dist/${target}.global.prod.js`;
   if (fs.existsSync(esmProdBuild)) {
     const file = fs.readFileSync(esmProdBuild);
     const minSize = (file.length / 1024).toFixed(2) + "kb";

scripts/jest.js

@@ -0,0 +1,7 @@
+/**
+ * This file is the entry for debug single test file in vscode
+ *
+ * Not using node_modules/.bin/jest due to cross platform issues, see
+ * https://github.com/microsoft/vscode-recipes/issues/107
+ */
+require("jest").run(process.argv);

scripts/utils.js

@@ -1,4 +1,5 @@
 const fs = require("fs");
+const chalk = require("chalk");
 
 const targets = (exports.targets = fs.readdirSync("packages").filter(f => {
   if (!fs.statSync(`packages/${f}`).isDirectory()) {
@@ -26,6 +27,14 @@ exports.fuzzyMatchTarget = (partialTargets, includeAllMatching) => {
   if (matched.length) {
     return matched;
   } else {
-    throw new Error(`Target ${partialTargets} not found!`);
+    console.log();
+    console.error(
+      `  ${chalk.bgRed.white(" ERROR ")} ${chalk.red(
+        `Target ${chalk.underline(partialTargets)} not found!`
+      )}`
+    );
+    console.log();
+
+    process.exit(1);
   }
 };

scripts/verifyCommit.js

@@ -22,12 +22,7 @@ if (!commitRE.test(msg) && !mergeCommitRE.test(msg)) {
       `    ${chalk.green(
         `fix(v-model): handle events on blur (close #28)`
       )}\n\n` +
-      chalk.red(`  See .github/commit-convention.md for more details.\n`) +
-      chalk.red(
-        `  You can also use ${chalk.cyan(
-          `npm run commit`
-        )} to interactively generate a commit message.\n`
-      )
+      chalk.red(`  See .github/commit-convention.md for more details.\n`)
   );
   process.exit(1);
 }