设置项目名称及下载等

front-view/public/assets/index.0626f78d.js

-import{r as e,o as t,a as l,p as a,b as n,c as s,d as i,w as o,v as c,e as u,F as r,f as d,g as m,h as p,t as v,i as b,j as y}from"./vendor.049267cb.js";const g={name:"Main",setup(){const a=e(null),n=e(1),s=e(null),i=e(null),o=e([{title:"Vue3版大屏",desc:"Vue3.0 + TypeScript + Vite2.0大屏用",url:"gitee:guomingyao/my-view"},{title:"Vue2大屏",desc:"Vue2.0大屏用",url:"gitee:guomingyao/monitor-template"},{title:"Vite App",desc:"Vue3.0 + Vite2.0 普通项目用",url:"gitee:guomingyao/my-vite-app"},{title:"微前端",desc:"微前端父项目模板",url:"gitee:guomingyao/micfrontend-template"}]),c=e(null),u=e(null),r=e=>{const{command:t,data:l}=e.data;switch(t){case"DIRECTORY":u.value=l.text}};t((()=>{window.addEventListener("message",r)})),l((()=>{window.removeEventListener("message",r)}));return{fileRef:a,step:n,curIndex:s,curData:i,templates:o,filename:c,directory:u,onClick:(e,t)=>{i.value=e,s.value=t},selectDirectory:()=>{vscode.postMessage({command:"SELECT_FOLDER"})},toStep:e=>{n.value=e},submit:()=>{vscode.postMessage({command:"FETCH_PROJECT",data:{url:i.value.url,filePath:u.value,filename:c.value}})}}}},f=p();a("data-v-54631bd4");const C=u("h2",null,"选择模板",-1),k={class:"wrapper"},V=u("h2",null,"选择目录",-1),h={class:"item"},w={class:"item directory"};n();const E=f(((e,t,l,a,n,p)=>(s(),i("main",null,[o(u("section",null,[C,u("div",k,[(s(!0),i(r,null,d(a.templates,((e,t)=>(s(),i("div",{key:e.title},[u("div",{class:["inner",{on:a.curIndex===t}],onClick:l=>a.onClick(e,t)},[u("h3",null,v(e.title),1),u("span",null,v(e.desc),1)],10,["onClick"])])))),128))]),u("button",{onClick:t[1]||(t[1]=e=>a.toStep(2)),class:""+(a.curData?"btn":"disable-btn")},"下一步",2)],512),[[c,1===a.step]]),o(u("section",null,[V,u("div",h,[o(u("input",{type:"text","onUpdate:modelValue":t[2]||(t[2]=e=>a.filename=e),title:a.filename,placeholder:"请输入项目名称"},null,8,["title"]),[[m,a.filename]])]),u("div",w,[u("input",{value:a.directory,title:a.directory,type:"text",placeholder:"请选择项目存放路径",readonly:""},null,8,["value","title"]),u("button",{class:"btn",onClick:t[3]||(t[3]=(...e)=>a.selectDirectory&&a.selectDirectory(...e))},"选择")]),u("button",{onClick:t[4]||(t[4]=(...e)=>a.submit&&a.submit(...e)),class:""+(a.filename&&a.directory?"btn":"disable-btn")},"完成",2),u("button",{onClick:t[5]||(t[5]=e=>a.toStep(1)),class:"btn"},"上一步")],512),[[c,2===a.step]])]))));g.render=E,g.__scopeId="data-v-54631bd4";const D={name:"App",components:{Main:g}};D.render=function(e,t,l,a,n,o){const c=b("Main");return s(),i(c)};y(D).mount("#app");

front-view/public/assets/index.3a37693c.css

+.my-loader-mask[data-v-6ecfd4d3]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:99999;display:flex;align-items:center;justify-content:center;flex-direction:column}.my-loader[data-v-6ecfd4d3]{position:relative}.my-loader .inner[data-v-6ecfd4d3],.my-loader .middle[data-v-6ecfd4d3],.my-loader .outer[data-v-6ecfd4d3]{border:4px solid transparent;border-top-color:#47b3ff;border-right-color:#47b3ff;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(0)}.my-loader .outer[data-v-6ecfd4d3]{width:35px;height:35px;animation:spin-6ecfd4d3 2.5s linear infinite}.my-loader .middle[data-v-6ecfd4d3]{width:21px;height:21px;animation:spin-6ecfd4d3 2s linear reverse infinite}.my-loader .inner[data-v-6ecfd4d3]{width:8px;height:8px;animation:spin-6ecfd4d3 1.5s linear infinite}@-moz-keyframes spin-6ecfd4d3{to{transform:translate(-50%,-50%) rotate(360deg);border-top-color:#00f2ff;border-right-color:#00f2ff}}@-webkit-keyframes spin-6ecfd4d3{to{transform:translate(-50%,-50%) rotate(360deg);border-top-color:#00f2ff;border-right-color:#00f2ff}}@-o-keyframes spin-6ecfd4d3{to{transform:translate(-50%,-50%) rotate(360deg);border-top-color:#00f2ff;border-right-color:#00f2ff}}@keyframes spin-6ecfd4d3{to{transform:translate(-50%,-50%) rotate(360deg);border-top-color:#00f2ff;border-right-color:#00f2ff}}h2[data-v-1848f50d]{padding:0 12px}.wrapper[data-v-1848f50d]{display:flex;flex-wrap:wrap}.wrapper>div[data-v-1848f50d]{width:25%;padding:10px;box-sizing:border-box}.wrapper>div .inner[data-v-1848f50d]{background:#3b3b47;height:140px;padding:10px 20px;cursor:pointer;transition:border .2s ease-in-out;border:1px solid transparent;box-sizing:border-box;position:relative}.wrapper>div .inner span[data-v-1848f50d]{color:#ccc;font-size:12px}.wrapper>div .inner.on[data-v-1848f50d],.wrapper>div .inner[data-v-1848f50d]:hover{border:1px solid #2f86ee}.wrapper>div .inner.on[data-v-1848f50d]:before{content:'';display:inline-block;position:absolute;top:2px;right:2px;width:0;height:0;border:10px solid transparent;border-top-color:inherit;border-right-color:inherit}.item[data-v-1848f50d]{width:40%;margin:40px auto;display:flex;height:34px}.item .btn[data-v-1848f50d]{float:none;margin:0;width:100px;margin-left:10px}.item input[data-v-1848f50d]{display:block;flex:1;border:none;outline:0;font-size:14px;padding:0 14px;line-height:34px;color:#2c3e50;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}html{background:#1e2127}#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#eee;padding:0 10px}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.btn{z-index:1;position:relative;font-size:inherit;font-family:inherit;color:#fff;padding:10px 20px;outline:0;border:none;background-color:#3b3b47;overflow:hidden;transition:color .4s ease-in-out;float:right;margin:10px 10px 0 0}.disable-btn{z-index:1;position:relative;font-size:inherit;font-family:inherit;color:#fff;padding:10px 20px;outline:0;border:none;background-color:#3b3b47;overflow:hidden;transition:color .4s ease-in-out;float:right;margin:10px 10px 0 0;opacity:.5;cursor:not-allowed;pointer-events:all!important}.btn::before{content:'';z-index:-1;position:absolute;top:50%;left:50%;width:1em;height:1em;border-radius:50%;background-color:#2f86ee;transform-origin:center;transform:translate3d(-50%,-50%,0) scale3d(0,0,0);transition:transform .45s ease-in-out}.btn:hover{cursor:pointer;color:#161616}.btn:hover::before{transform:translate3d(-50%,-50%,0) scale3d(15,15,15)}
\ No newline at end of file

front-view/public/assets/index.7c40afb3.css

-h2[data-v-54631bd4]{padding:0 12px}.wrapper[data-v-54631bd4]{display:flex;flex-wrap:wrap}.wrapper>div[data-v-54631bd4]{width:25%;padding:10px;box-sizing:border-box}.wrapper>div .inner[data-v-54631bd4]{background:#3b3b47;height:140px;padding:10px 20px;cursor:pointer;transition:border .2s ease-in-out;border:1px solid transparent;box-sizing:border-box;position:relative}.wrapper>div .inner span[data-v-54631bd4]{color:#ccc;font-size:12px}.wrapper>div .inner.on[data-v-54631bd4],.wrapper>div .inner[data-v-54631bd4]:hover{border:1px solid #2f86ee}.wrapper>div .inner.on[data-v-54631bd4]:before{content:'';display:inline-block;position:absolute;top:2px;right:2px;width:0;height:0;border:10px solid transparent;border-top-color:inherit;border-right-color:inherit}.item[data-v-54631bd4]{width:40%;margin:40px auto;display:flex;height:34px}.item .btn[data-v-54631bd4]{float:none;margin:0;width:100px;margin-left:10px}.item input[data-v-54631bd4]{display:block;flex:1;border:none;outline:0;font-size:14px;padding:0 14px;line-height:34px;color:#2c3e50;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}html{background:#1e2127}#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#eee;padding:0 10px}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.btn{z-index:1;position:relative;font-size:inherit;font-family:inherit;color:#fff;padding:.5em 1em;outline:0;border:none;background-color:#3b3b47;overflow:hidden;transition:color .4s ease-in-out;float:right;margin:10px 10px 0 0}.disable-btn{z-index:1;position:relative;font-size:inherit;font-family:inherit;color:#fff;padding:.5em 1em;outline:0;border:none;background-color:#3b3b47;overflow:hidden;transition:color .4s ease-in-out;float:right;margin:10px 10px 0 0;opacity:.5;cursor:not-allowed;pointer-events:all!important}.btn::before{content:'';z-index:-1;position:absolute;top:50%;left:50%;width:1em;height:1em;border-radius:50%;background-color:#2f86ee;transform-origin:center;transform:translate3d(-50%,-50%,0) scale3d(0,0,0);transition:transform .45s ease-in-out}.btn:hover{cursor:pointer;color:#161616}.btn:hover::before{transform:translate3d(-50%,-50%,0) scale3d(15,15,15)}
\ No newline at end of file

front-view/public/assets/index.e69163f5.js

+import{p as e,a as t,o as a,c as l,r as s,w as n,b as o,d as i,e as c,f as d,g as r,v as u,F as m,h as p,i as v,j as y,k as g,t as b,l as f}from"./vendor.f6a3a0fc.js";const k={name:"MyLoader",displayName:"m-loader",props:{background:{type:String,default:"rgba(0,0,0,0.3)"}}},C=n();e("data-v-6ecfd4d3");const L=o("div",{class:"my-loader"},[o("div",{class:"outer"}),o("div",{class:"middle"}),o("div",{class:"inner"})],-1);t();const h=C(((e,t,n,o,i,c)=>(a(),l("div",{class:"my-loader-mask",style:`background:${n.background}`},[L,s(e.$slots,"default",{},void 0,!0)],4))));k.render=h,k.__scopeId="data-v-6ecfd4d3";const w={name:"Main",components:{Loader:k},setup(){const e=i(null),t=i(1),a=i(null),l=i(null),s=i(!1),n=i([{title:"Vue3版大屏",desc:"Vue3.0 + TypeScript + Vite2.0大屏用",url:"gitee:guomingyao/my-view"},{title:"Vue2大屏",desc:"Vue2.0大屏用",url:"gitee:guomingyao/monitor-template"},{title:"Vite App",desc:"Vue3.0 + Vite2.0 普通项目用",url:"gitee:guomingyao/my-vite-app"},{title:"微前端",desc:"微前端父项目模板",url:"gitee:guomingyao/micfrontend-template"}]),o=i(null),r=i(null),u=e=>{const{command:t,data:a}=e.data;switch(t){case"DIRECTORY":r.value=a.text;break;case"CLOSE_LOADER":s.value=!1}};c((()=>{window.addEventListener("message",u)})),d((()=>{window.removeEventListener("message",u)}));return{fileRef:e,step:t,curIndex:a,curData:l,templates:n,filename:o,directory:r,onClick:(e,t)=>{l.value=e,a.value=t},selectDirectory:()=>{vscode.postMessage({command:"SELECT_FOLDER"})},toStep:e=>{t.value=e},submit:()=>{s.value=!0,vscode.postMessage({command:"FETCH_PROJECT",data:{url:l.value.url,filePath:r.value,filename:o.value}})},showLoader:s}}},E=n();e("data-v-1848f50d");const V=o("h2",null,"选择模板",-1),D={class:"wrapper"},S=o("h2",null,"选择目录",-1),_={class:"item"},M={class:"item directory"};t();const R=E(((e,t,s,n,i,c)=>{const d=g("Loader");return a(),l("main",null,[r(o("section",null,[V,o("div",D,[(a(!0),l(m,null,p(n.templates,((e,t)=>(a(),l("div",{key:e.title},[o("div",{class:["inner",{on:n.curIndex===t}],onClick:a=>n.onClick(e,t)},[o("h3",null,b(e.title),1),o("span",null,b(e.desc),1)],10,["onClick"])])))),128))]),o("button",{onClick:t[1]||(t[1]=e=>n.toStep(2)),class:""+(n.curData?"btn":"disable-btn")},"下一步",2)],512),[[u,1===n.step]]),r(o("section",null,[S,o("div",_,[r(o("input",{type:"text","onUpdate:modelValue":t[2]||(t[2]=e=>n.filename=e),title:n.filename,placeholder:"请输入项目名称"},null,8,["title"]),[[v,n.filename]])]),o("div",M,[o("input",{value:n.directory,title:n.directory,type:"text",placeholder:"请选择项目存放路径",readonly:""},null,8,["value","title"]),o("button",{class:"btn",onClick:t[3]||(t[3]=(...e)=>n.selectDirectory&&n.selectDirectory(...e))},"选择")]),o("button",{onClick:t[4]||(t[4]=(...e)=>n.submit&&n.submit(...e)),class:""+(n.filename&&n.directory?"btn":"disable-btn")},"完成",2),o("button",{onClick:t[5]||(t[5]=e=>n.toStep(1)),class:"btn"},"上一步")],512),[[u,2===n.step]]),n.showLoader?(a(),l(d,{key:0})):y("",!0)])}));w.render=R,w.__scopeId="data-v-1848f50d";const x={name:"App",components:{Main:w}};x.render=function(e,t,s,n,o,i){const c=g("Main");return a(),l(c)};f(x).mount("#app");

front-view/public/index.html

@@ -6,9 +6,9 @@
   <link rel="icon" href="/favicon.ico" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>My Cli</title>
-<script type="module" crossorigin src="./assets/index.0626f78d.js"></script>
-  <link rel="modulepreload" href="./assets/vendor.049267cb.js">
-  <link rel="stylesheet" href="./assets/index.7c40afb3.css">
+<script type="module" crossorigin src="./assets/index.e69163f5.js"></script>
+  <link rel="modulepreload" href="./assets/vendor.f6a3a0fc.js">
+  <link rel="stylesheet" href="./assets/index.3a37693c.css">
 </head>
 
 <body>

front-view/src/assets/css/var.styl

+$full(w = 100%, h = 100%)
+  width w
+  height h
+  box-sizing border-box
+
+$center()
+  display flex
+  align-items center
+  justify-content center
+
+$blur(val = 0.05rem)
+  backdrop-filter blur(val)
+  -webkit-backdrop-filter blur(val)
+
+$border(color = #000, width = 0.01rem)
+  border width solid color
+
+$primary-color = #47B3FF
+$secondary-color = #5BD5FF
+$primary-bg = rgba(49,94,139,.3)
+$primary-border = rgba(91,213,255,.5)
+$red = #CB1B45
+$blue = #2F86EE
+$yellow = #ffd400
+$green = #4F953B
+$edge = #00f2ff
+$orange = #F7933E
+
+$card-bg = linear-gradient(to bottom, rgba(5,71,138,.2), rgba(5,71,138,.6))
+$card-title-color = #fff
+$card-title-size = .14rem
+$card-border = .01rem solid $primary-border
+
+$table-title-bg =rgba(2,27,53,.8)
+$table-content-bg = rgba(2,27,53,.6)
+$table-content-hover-color = $primary-color
+$table-content-hover-bg = $primary-bg
+
+$font-color = #70A7E0
+
+$table-bg(opacity = 0.3)
+  rgba(0, 118, 255, opacity )
+
+$card-bg2(opacity = 0.4, shadow = 0.2)
+  background rgba(70,83,97,opacity)
+  box-shadow inset 0 .01rem .02rem 0 rgba(204,204,204,shadow)
+  border-radius .03rem
\ No newline at end of file

front-view/src/components/loader.vue

+<template>
+  <div class="my-loader-mask" :style="`background:${background}`">
+    <div class="my-loader">
+      <div class="outer" />
+      <div class="middle" />
+      <div class="inner" />
+    </div>
+    <slot />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'MyLoader',
+  displayName: 'm-loader',
+  props: {
+    background: {
+      type: String,
+      default: 'rgba(0,0,0,0.3)',
+    },
+  },
+}
+</script>
+
+<style lang="stylus" scoped>
+@import '../assets/css/var.styl'
+.my-loader-mask
+  position fixed
+  top 0
+  right 0
+  bottom 0
+  left 0
+  z-index 99999
+  $center()
+  flex-direction column
+.my-loader
+  position relative
+  .outer,
+  .middle,
+  .inner
+    border 4px solid transparent
+    border-top-color #47B3FF
+    border-right-color @border-top-color
+    border-radius 50%
+    position absolute
+    top 50%
+    left 50%
+    transform translate(-50%, -50%) rotate(0deg)
+  .outer
+    width 35px
+    height @width
+    animation spin 2.5s linear infinite
+  .middle
+    width 21px
+    height @width
+    animation spin 2s linear reverse infinite
+  .inner
+    width 8px
+    height @width
+    animation spin 1.5s linear infinite
+@keyframes spin {
+  to {
+    transform translate(-50%, -50%) rotate(360deg)
+    border-top-color #00f2ff
+    border-right-color @border-top-color
+  }
+}
+</style>

front-view/src/components/main.vue

@@ -24,18 +24,22 @@
     <button @click="submit" :class="`${(filename && directory) ? 'btn' : 'disable-btn'}`">完成</button>
     <button @click="toStep(1)" class='btn'>上一步</button>
   </section>
+  <Loader v-if="showLoader" />
 </main>
 </template>
 
 <script>
 import {onBeforeUnmount, onMounted, ref} from 'vue'
+import Loader from './loader.vue'
 export default {
   name: 'Main',
+  components: {Loader},
   setup() {
     const fileRef = ref(null)
     const step = ref(1)
     const curIndex = ref(null)
     const curData = ref(null)
+    const showLoader = ref(false)
     const templates = ref([
       {
         title: 'Vue3版大屏',
@@ -70,6 +74,9 @@ export default {
         case 'DIRECTORY':
           directory.value = data.text
           break;
+        case 'CLOSE_LOADER':
+          showLoader.value = false
+          break;
         default:
           break;
       }
@@ -88,7 +95,9 @@ export default {
     const toStep = (val) => {
       step.value = val
     }
+
     const submit = () => {
+      showLoader.value = true
       vscode.postMessage({
         command: 'FETCH_PROJECT',
         data: {
@@ -110,6 +119,7 @@ export default {
       selectDirectory,
       toStep,
       submit,
+      showLoader,
     }
   }
 }

src/extension.ts

 // The module 'vscode' contains the VS Code extensibility API
 // Import the module and reference it with the alias vscode in your code below
 import * as vscode from 'vscode';
-import { getWebViewContent, fetchProject } from './util';
+import { getWebViewContent, fetchProject, updatePackageJson } from './util';
 
 // this method is called when your extension is activated
 // your extension is activated the very first time the command is executed
@@ -25,25 +25,33 @@ export function activate(context: vscode.ExtensionContext) {
 			}
 		);
 		panel.webview.html = getWebViewContent('../front-view/public/index.html');
-		panel.webview.onDidReceiveMessage(msg => {
-			console.log('====> ', msg);
+		panel.webview.onDidReceiveMessage(async msg => {
 			const {command, data} = msg;
 			switch (command) {
 				case 'FETCH_PROJECT':
 					const {url, filePath, filename} = data;
-					fetchProject({url, filePath, filename});
+					try {
+						await fetchProject({url, filePath, filename});
+					} catch (error) {
+						panel.webview.postMessage({
+							command: 'CLOSE_LOADER',
+						});
+					}
+					await updatePackageJson(data);
+					panel.webview.postMessage({
+						command: 'CLOSE_LOADER',
+					});
 					break;
 				case 'SELECT_FOLDER':
-					vscode.window.showOpenDialog({
+					const folders = await vscode.window.showOpenDialog({
 						canSelectFolders: true,
 						canSelectFiles: false
-					}).then(folders => {
-						panel.webview.postMessage({
-							command: 'DIRECTORY',
-							data: {
-								text: folders?.[0]?.path
-							}
-						});
+					});
+					panel.webview.postMessage({
+						command: 'DIRECTORY',
+						data: {
+							text: folders?.[0]?.path
+						}
 					});
 					break;
 				default:

src/util/index.ts

@@ -29,9 +29,13 @@ export interface FileConfig {
   filename: string
 }
 
-export const fetchProject = ({url, filePath, filename}: FileConfig) => {
+export const fetchProject = ({url, filePath, filename}: FileConfig):Promise<void> => {
   const projectPath = `${filePath}/${filename}`;
-	const start = () => {
+  return new Promise((resolve, reject) => {
+    if (isDirExist(projectPath)) {
+      vscode.window.showErrorMessage('该路径下已存在同名项目文件夹！');
+      return reject();
+    }
     download(url, projectPath, {clone: true}, async (err:Error) => {
       if (err) {
         vscode.window.showErrorMessage(err.message);
@@ -39,11 +43,33 @@ export const fetchProject = ({url, filePath, filename}: FileConfig) => {
       }
       vscode.window.showInformationMessage(`'${filename}' 项目创建成功!`);
       await vscode.commands.executeCommand('vscode.openFolder', vscode.Uri.file(projectPath), true);
+      return resolve();
     });
-  };
-  if (isDirExist(projectPath)) {
-    vscode.window.showErrorMessage('该路径下已存在同名项目文件夹！');
-    return;
-  }
-  start();
+  });
+};
+
+const packageInfo = ({name, path}: {name: string, path: string}):Promise<any> => {
+  return new Promise((resolve, reject) => {
+    fs.readFile(`${path}/package.json`, 'utf8', (err, data) => {
+      if (err) {
+        return reject(err);
+      }
+      const packageJson = JSON.parse(data);
+      packageJson.name = name;
+      return resolve(JSON.stringify(packageJson, null, 2));
+    });
+  });
+};
+
+export const updatePackageJson = async ({filePath, filename}: FileConfig):Promise<void> => {
+  const path = `${filePath}/${filename}`;
+  const data = await packageInfo({path, name: filename});
+  return new Promise((resolve, reject) => {
+    fs.writeFile(`${path}/package.json`, data, 'utf8', err => {
+      if (err) {
+        return reject();
+      }
+      return resolve();
+    });
+  });
 };
\ No newline at end of file