Merge pull request #154 from tkskto/develop

v0.4.1

Author: tkskto

CHANGELOG.md

@@ -1,5 +1,16 @@
 # Changelog
 
+## 0.4.1
+
+### Chores
+
+-   \#153 update dependency `vue-eslint-parser` to v8.2.0
+-   \#138 update dependency `ws` to v8.5.0
+
+### Fixes
+
+-   update Vue.js logo to SVG.
+
 ## 0.4.0
 
 ### enhancement

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@tkskto/vue-component-analyzer",
-  "version": "0.4.0",
+  "version": "0.4.1",
   "description": "Analyze dependency tree for Vue.js SFC (Single File Component)",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -47,34 +47,34 @@
   "dependencies": {
     "commander": "8.3.0",
     "ejs": "3.1.6",
-    "express": "4.17.1",
+    "express": "4.17.3",
     "globby": "11.0.4",
     "mkdirp": "1.0.4",
     "opener": "1.5.2",
-    "vue-eslint-parser": "8.0.1",
-    "ws": "8.3.0"
+    "vue-eslint-parser": "8.2.0",
+    "ws": "8.5.0"
   },
   "devDependencies": {
-    "@mitsue/eslint-config": "4.0.1",
+    "@mitsue/eslint-config": "4.1.0",
     "@rollup/plugin-commonjs": "21.0.1",
     "@rollup/plugin-json": "4.1.0",
-    "@rollup/plugin-node-resolve": "13.0.6",
+    "@rollup/plugin-node-resolve": "13.1.3",
     "@rollup/plugin-typescript": "8.3.0",
     "@types/ejs": "3.1.0",
-    "@types/express": "4.17.12",
+    "@types/express": "4.17.13",
     "@types/mkdirp": "1.0.2",
-    "@types/mocha": "9.0.0",
+    "@types/mocha": "9.1.0",
     "@types/node": "16.11.11",
     "@types/opener": "1.4.0",
-    "@types/ws": "8.2.1",
-    "@typescript-eslint/eslint-plugin": "4.33.0",
-    "@typescript-eslint/parser": "4.33.0",
-    "eslint": "7.32.0",
+    "@types/ws": "8.2.3",
+    "@typescript-eslint/eslint-plugin": "5.12.0",
+    "@typescript-eslint/parser": "5.12.0",
+    "eslint": "8.9.0",
     "husky": "7.0.4",
-    "lint-staged": "12.1.2",
-    "mocha": "9.1.3",
+    "lint-staged": "12.3.4",
+    "mocha": "9.2.1",
     "nyc": "15.1.0",
-    "rollup": "2.60.2",
+    "rollup": "2.67.3",
     "rollup-plugin-license": "2.6.0",
     "rollup-plugin-terser": "7.0.2",
     "ts-mocha": "8.0.0",

package.json

@@ -25,7 +25,7 @@ export const makeImage = (url: string): Promise<HTMLImageElement> => (
 export const makeSVG = async (app: HTMLDivElement, width: number, height: number): Promise<string> => {
   const clone = app.cloneNode(true) as HTMLDivElement;
 
-  const willRemoveElements = clone.querySelectorAll<HTMLImageElement>('img, script');
+  const willRemoveElements = clone.querySelectorAll<HTMLImageElement>('img, script, svg');
 
   willRemoveElements.forEach((element) => {
     if (element.parentElement) {

src/client/ScreenCapture.ts

@@ -15,6 +15,7 @@ export class Seed {
 
   private _count: number;
 
+  // eslint-disable-next-line no-use-before-define
   private _children: Seed[] = []; // imported modules from this file.
 
   /**
@@ -64,7 +65,7 @@ export class Seed {
     let name = this._name;
 
     if (this._name.endsWith('.vue')) {
-      name = `<img class="icon" src="https://v3.vuejs.org/logo.png" alt="">${name}`;
+      name = `<svg class="icon" viewBox="0 0 128 128" width="24" height="24"><use xlink:href="#logo"></use></svg>${name}`;
     } else if (this._name.endsWith('.js')) {
       name = `<img class="icon" src="https://raw.githubusercontent.com/voodootikigod/logo.js/master/js.png" alt="">${name}`;
     } else if (this._name.endsWith('.ts')) {

src/client/Seed.ts

@@ -18,36 +18,36 @@ class CustomDialog {
     }
   }
 
-  show = () => {
+  show() {
     document.body.classList.add('-dialog-show');
     disableTabIndex('#dialog');
   }
 
-  close = () => {
+  close() {
     document.body.classList.remove('-dialog-show');
     resetTabIndex();
   }
 
-  load = () => {
+  load() {
     this.show();
 
     if (this._contents) {
       this._contents.innerHTML = '<p>now loading...</p>';
     }
   }
 
-  complete = (html: string) => {
+  complete(html: string) {
     if (this._contents) {
       this._contents.innerHTML = html;
     }
   }
 
-  showExportDialog = async () => {
+  async showExportDialog() {
     this.load();
     const img = await capture();
     this._btnExport.href = img.src;
     this.complete(img.outerHTML);
-  };
+  }
 }
 
 export const customDialog = new CustomDialog();

src/client/dialog/index.ts

@@ -15,7 +15,7 @@ export class Model extends CustomEventDispatcher {
   public static EVENT = {
     DATA_UPDATE: 'dataUpdate',
     SETTING_CHANGED: 'settingChanged',
-  }
+  };
 
   private _today: Date;
 

src/client/model.ts

@@ -59,7 +59,7 @@ export class Renderer {
     }
 
     this.render();
-  }
+  };
 
   private renderLine(name: string, level: number, isLast: boolean): string {
     let line = ' ';

src/client/renderer.ts

@@ -53,7 +53,7 @@ export class VueComponent {
     this._importDeclaration = getImportDeclaration(esLintProgram.body);
   }
 
-  private getProps = (tokens: Token[]): string => {
+  private getProps(tokens: Token[]): string {
     try {
       const propsDeclaration = JSON.parse(getDeclarationSyntax(tokens, 'props'));
 

src/server/VueComponent.ts

@@ -36,6 +36,7 @@
 </main>
 <footer>
   <p>If you saw any problems, please let me know on <a href="https://github.com/tkskto/vue-component-analyzer/issues">github issue</a>.</p>
+  <p>Vue.js logo is copy of <a href="https://vuejs.org/index.html">official Vue.js website</a>.</p>
 </footer>
 <div id="dialog" class="dialog">
 <div class="dialog-inner">
@@ -47,5 +48,11 @@
 </div>
 <div class="dialog-overlay"></div>
 </div>
+<svg class="logo" viewBox="0 0 128 128" width="24" height="24" data-v-5f26462c="">
+<symbol id="logo">
+<path fill="#42b883" d="M78.8,10L64,35.4L49.2,10H0l64,110l64-110C128,10,78.8,10,78.8,10z" data-v-5f26462c="" />
+<path fill="#35495e" d="M78.8,10L64,35.4L49.2,10H25.6L64,76l38.4-66H78.8z" data-v-5f26462c="" />
+</symbol>
+</svg>
 </body>
 </html>