finish check function

Author: yuanpengfei

.vscode/settings.json

@@ -7,5 +7,8 @@
         "out": true // set this to false to include "out" folder in search results
     },
     // Turn off tsc task auto detection since we have the necessary tasks as npm scripts
-    "typescript.tsc.autoDetect": "off"
+    "typescript.tsc.autoDetect": "off",
+    "editor.quickSuggestions": {
+        "strings": true
+    }
 }

README.md

@@ -6,37 +6,36 @@
 
 ### support input name style
 
-- DemoComponent -> DemoComponent `recommand`
-- demo component -> DemoComponent `recommand`
-- demo-component -> DemoComponent `recommand`
-- demoComponent -> DemoComponent
-- Demo-component -> DemoComponent
-- Demo Component -> DemoComponent
-- Demo component -> DemoComponent
-- Democomponent -> Democomponent `not recommand`
-- democomponent -> Democomponent `not recommand`
-
+-   DemoComponent -> DemoComponent `recommend`
+-   demo component -> DemoComponent `recommend`
+-   demo-component -> DemoComponent `recommend`
+-   demoComponent -> DemoComponent
+-   Demo-component -> DemoComponent
+-   Demo Component -> DemoComponent
+-   Demo component -> DemoComponent
+-   Democomponent -> Democomponent `not recommend`
+-   democomponent -> Democomponent `not recommend`
 
 ### code example
 
 ```html
-<template>
-</template>
-    
+<template> </template>
+
 <script lang="ts">
-    
-import { Vue, Component, Prop } from "vue-property-decorator";
-    
-@Component
-export default class A extends Vue {}
-    
+	import { Vue, Component, Prop } from "vue-property-decorator";
+
+	@Component
+	export default class ComponentName extends Vue {}
 </script>
-    
-<style lang="less" scoped>
-    
-</style>
+
+<style lang="less" scoped></style>
 ```
 
+### check vue filename
+
+> Help you rename you irregularly vue filename, and it's an options choice,
+> you can just choose No to check the files details in terminal panel.
+
 ### package and publish
 
 [Doc](https://code.visualstudio.com/api/working-with-extensions/publishing-extension)
@@ -46,4 +45,4 @@ export default class A extends Vue {}
     vsce package
     // publish
     vsce publish
-```
+```

package-lock.json

@@ -23,25 +23,41 @@
 			{
 				"command": "createvueclasscomponent.create",
 				"title": "Create Vue Class Component"
+			},
+			{
+				"command": "createvueclasscomponent.check",
+				"title": "Check Vue Filename"
 			}
 		],
 		"keybindings": [
 			{
 				"command": "createvueclasscomponent.create",
 				"when": "explorerResourceIsFolder || resourceScheme == file"
+			},
+			{
+				"command": "createvueclasscomponent.check",
+				"when": "explorerResourceIsFolder || resourceScheme == file"
 			}
 		],
 		"menus": {
 			"editor/context": [
 				{
 					"command": "createvueclasscomponent.create",
 					"group": "navigation"
+				},
+				{
+					"command": "createvueclasscomponent.check",
+					"group": "navigation"
 				}
 			],
 			"explorer/context": [
 				{
 					"command": "createvueclasscomponent.create",
 					"group": "navigation"
+				},
+				{
+					"command": "createvueclasscomponent.check",
+					"group": "navigation"
 				}
 			]
 		}

package.json

@@ -3,58 +3,98 @@ import * as fs from "fs";
 import convertWords2BigCamelCaseStyle from "./convertWords2BigCamelCaseStyle";
 
 interface Data {
-  oldPath: string;
-  newPath: string;
-}
-
-/**
- * @param filename
- * @returns
- */
-function isVueName(filename: string) {
-  return /\.vue$/.test(filename);
+	oldPath: string;
+	tempPath: string;
+	newPath: string;
 }
 
 function readFilesOfDest(uri: vscode.Uri) {
-  const _path = uri.path;
-  const res: Data[] = [];
-  function read(dir: string) {
-    const files = fs.readdirSync(dir);
-    files.map((v) => {
-      const p = `${dir}/${v}`;
-      if (fs.lstatSync(p).isFile()) {
-        isVueName(v) &&
-          !/[A-Z]/g.test(v[0]) &&
-          res.push({
-            oldPath: p,
-            newPath: `${dir}/${convertWords2BigCamelCaseStyle(v)}`,
-          });
-      } else {
-        read(p);
-      }
-    });
-  }
-
-  read(_path);
-
-  return res;
-}
+	const _path = uri.path;
+	if (fs.lstatSync(_path).isFile()) {
+		if (_path.endsWith(".vue")) {
+			const arr = _path.split("/");
+			const filename = arr.pop();
+			const dir = arr.join("/");
+
+			return [handleFile(filename!, dir)];
+		}
+
+		return [];
+	}
+
+	const res: Data[] = [];
 
-function rename({ oldPath, newPath }: Data) {
-  fs.renameSync(oldPath, newPath);
+	function handleFile(v: string, dir: string): Data {
+		if (/\.vue$/.test(v) && !/[A-Z]/g.test(v[0])) {
+			return {
+				oldPath: `${dir}/${v}`,
+				tempPath: `${dir}/${convertWords2BigCamelCaseStyle(v)}.temp`,
+				newPath: `${dir}/${convertWords2BigCamelCaseStyle(v)}`,
+			};
+		}
+
+		return null as any as Data;
+	}
+
+	function read(dir: string) {
+		const files = fs.readdirSync(dir);
+		files.map((v) => {
+			if (fs.lstatSync(`${dir}/${v}`).isFile()) {
+				const d = handleFile(v, dir);
+				res.push(d);
+			} else {
+				read(`${dir}/${v}`);
+			}
+		});
+	}
+
+	read(_path);
+
+	return res;
+}
 
-  fs.existsSync(oldPath) && fs.unlinkSync(oldPath);
+function rename({ oldPath, tempPath, newPath }: Data) {
+	fs.copyFileSync(oldPath, tempPath);
+	fs.unlinkSync(oldPath);
+	fs.copyFileSync(tempPath, newPath);
+	fs.unlinkSync(tempPath);
 }
 
 function checkDestinationVueFilename(context: vscode.ExtensionContext) {
-  context.subscriptions.push(
-    vscode.commands.registerCommand(
-      "createvueclasscomponent.create",
-      async (uri: vscode.Uri) => {
-        readFilesOfDest(uri).forEach((v) => rename(v));
-      }
-    )
-  );
+	context.subscriptions.push(
+		vscode.commands.registerCommand(
+			"createvueclasscomponent.check",
+			async (uri: vscode.Uri) => {
+				const files = readFilesOfDest(uri);
+				if (!files.length) {
+					vscode.window.showInformationMessage(
+						"Congratulations， your vue filenames are all regularly!"
+					);
+					return;
+				}
+				vscode.window
+					.showInformationMessage(
+						`You have some files that are not named irregularly,\n
+            do you want me to rename them for you?\n
+            If you choose yes, I'll automatically rename them for you\n
+            or I'll show you where they are.`,
+						"Yes",
+						"No"
+					)
+					.then((v) => {
+						if (v === "Yes") {
+							files.forEach((v) => rename(v));
+						} else {
+							const str = files.map((v) => v.oldPath).join("\n");
+							const terminal =
+								vscode.window.createTerminal("File Details");
+							terminal.sendText(str, true);
+							terminal.show();
+						}
+					});
+			}
+		)
+	);
 }
 
 export default checkDestinationVueFilename;

src/checkDestinationVueFilename.ts

@@ -1,9 +1,10 @@
-import * as vscode from 'vscode';
-// import createVueClassComponent from './createVueClassComponent';
-import checkDestinationVueFilename from './checkDestinationVueFilename';
+import * as vscode from "vscode";
+import createVueClassComponent from "./createVueClassComponent";
+import checkDestinationVueFilename from "./checkDestinationVueFilename";
 
 export function activate(context: vscode.ExtensionContext) {
+	createVueClassComponent(context);
 	checkDestinationVueFilename(context);
 }
 
-export function deactivate() { }
+export function deactivate() {}