diff --git a/packages/toolkits/pro/package.json b/packages/toolkits/pro/package.json index 6b2a4b7e..3d951599 100644 --- a/packages/toolkits/pro/package.json +++ b/packages/toolkits/pro/package.json @@ -54,12 +54,13 @@ "node": ">=8.9" }, "dependencies": { - "@opentiny/cli-devkit": "^1.0.0-alpha.0", + "@opentiny/cli-devkit": "^1.0.1", "chalk": "^4.1.2", "cross-spawn": "^7.0.3", + "dotenv": "^16.0.3", "fs-extra": "^10.1.0", - "open": "^8.4.0", - "inquirer": "^8.0.2" + "inquirer": "^8.0.2", + "open": "^8.4.0" }, "devDependencies": { "@bitjson/npm-scripts-info": "^1.0.0", diff --git a/packages/toolkits/pro/src/lib/init.ts b/packages/toolkits/pro/src/lib/init.ts index 7991f160..ab832c9f 100644 --- a/packages/toolkits/pro/src/lib/init.ts +++ b/packages/toolkits/pro/src/lib/init.ts @@ -5,6 +5,8 @@ import inquirer, { QuestionCollection } from 'inquirer'; import { cliConfig, logs, fs, user, modules } from '@opentiny/cli-devkit'; import { InitAnswers } from './interfaces'; import utils from './utils'; +import * as dotenv from 'dotenv'; +dotenv.config(); const log = logs('tiny-toolkit-pro'); const cwd = process.cwd(); @@ -36,18 +38,54 @@ const getInitAnswers = (): Promise => { { type: 'list', name: 'framework', - message: '请选择您希望使用的技术栈：', + message: '请选择您希望使用的客户端技术栈：', choices: [ { name: 'vue', value: vueTemplatePath }, { name: 'angular', value: ngTemplatePath }, ], default: vueTemplatePath, + prefix: '*', + }, + { + type: 'confirm', + name: 'useServer', + message: '是否需要对接服务端：', + default: true, }, ] as const; return inquirer.prompt(question); }; - +const serverQuestion: QuestionCollection = [ + { + type: 'list', + name: 'serverType', + message: '请选择您希望使用的服务端技术栈：', + choices: [ + { name: 'Spring Cloud', value: 'springCloud' }, + { name: 'Egg.js', value: 'eggJs' }, + { name: 'Nest.js', value: 'nestJs' }, + ], + default: 'springCloud', + prefix: '*', + }, + { + type: 'input', + name: 'host', + message: '请输入服务端Host：', + // 必填校验 + validate: (input: string) => Boolean(input), + prefix: '*', + }, + { + type: 'input', + name: 'port', + message: '请输入服务端Port：', + // 必填校验 + validate: (input: string) => Boolean(input), + prefix: '*', + }, +]; /** * 同步创建项目文件目录、文件 * @answers 询问问题的选择值 @@ -71,8 +109,15 @@ const createProjectSync = (answers: InitAnswers) => { pluginFullname: fullName, }; - const { framework, description, name: packageJsonName } = answers; - + const { + framework, + description, + name: packageJsonName, + useServer, + serverType, + host, + port, + } = answers; const templatePath = framework === vueTemplatePath ? vueTemplatePath : ngTemplatePath; @@ -80,8 +125,7 @@ const createProjectSync = (answers: InitAnswers) => { const from = utils.getTemplatePath(templatePath); // 复制模板的目标目录 - const to = utils.getDistPath(); - + const to = utils.getDistPath(useServer ? 'web' : ''); // 项目名称，跟当前目录保持一致 fs.copyTpl(from, to, data, { @@ -95,7 +139,12 @@ const createProjectSync = (answers: InitAnswers) => { return filename; }, }); - + // 如果对接服务端，复制相关目录 + if (useServer) { + const serverFrom = utils.getTemplatePath(`server/${serverType}`); + const serverTo = utils.getDistPath('server'); + fs.copyTpl(serverFrom, serverTo); + } // 将项目名称、描述写入 package.json中 { const packageJsonPath = path.join(to, 'package.json'); @@ -107,6 +156,28 @@ const createProjectSync = (answers: InitAnswers) => { packageJson.name = packageJsonName; packageJson.description = description; + if (useServer) { + const envPath = path.join(to, '.env'); + const envConfig = dotenv.parse( + fs.readFileSync(envPath, writeOrReadOptions) + ); + envConfig.VITE_SEVER_HOST = `${host}:${port}`; + const config = Object.keys(envConfig) + .map((key) => `${key} = ${envConfig[key]}`) + .join('\n'); + fs.writeFileSync(envPath, config); + } else { + const envPath = path.join(to, '.env'); + const envConfig = dotenv.parse( + fs.readFileSync(envPath, writeOrReadOptions) + ); + envConfig.VITE_USE_MOCK = 'true'; + const config = Object.keys(envConfig) + .map((key) => `${key} = ${envConfig[key]}`) + .join('\n'); + fs.writeFileSync(envPath, config); + } + fs.writeFileSync( packageJsonPath, JSON.stringify(packageJson, null, 2), @@ -116,15 +187,20 @@ const createProjectSync = (answers: InitAnswers) => { }; // 安装依赖 -export const installDependencies = () => { +export const installDependencies = (useServer: boolean) => { const prefix = cliConfig.getBinName(); // npm 依赖安装 log.info('正在安装 npm 依赖，安装过程需要几十秒，请耐心等待...'); - spawn.sync('npm', ['install'], { stdio: 'inherit' }); + spawn.sync('npm', ['install'], { + cwd: useServer ? 'web/' : null, + stdio: 'inherit', + }); log.success('npm 依赖安装成功'); + if (useServer) process.chdir('web'); + /* prettier-ignore-start */ console.log( chalk.yellow( @@ -157,18 +233,26 @@ export const installDependencies = () => { export default async () => { // 拷贝模板到当前目录 + let useServerAnswer = false; try { // 创建项目文件夹及文件 - const answers = await getInitAnswers(); + const baseAnswers = await getInitAnswers(); + useServerAnswer = baseAnswers.useServer; + let serverAnswer: Object = {}; + if (baseAnswers.useServer) { + serverAnswer = await inquirer.prompt(serverQuestion); + } + const answers = Object.assign(baseAnswers, serverAnswer); createProjectSync(answers); } catch (e) { log.error('项目模板创建失败'); log.debug(e); throw e; } + // 安装依赖 try { - installDependencies(); + installDependencies(useServerAnswer); } catch (e) { log.error('npm 依赖安装失败'); log.error('请手动执行 tiny i 或 npm i'); diff --git a/packages/toolkits/pro/src/lib/interfaces.ts b/packages/toolkits/pro/src/lib/interfaces.ts index 6925ae7a..80e1c760 100644 --- a/packages/toolkits/pro/src/lib/interfaces.ts +++ b/packages/toolkits/pro/src/lib/interfaces.ts @@ -13,4 +13,8 @@ export interface InitAnswers { description: string; framework: string; name: string; + useServer: boolean; + serverType: string; + port: string; + host: string; } diff --git a/packages/toolkits/pro/template/server/eggJs/egg.js b/packages/toolkits/pro/template/server/eggJs/egg.js new file mode 100644 index 00000000..e69de29b diff --git a/packages/toolkits/pro/template/server/nestJs/nest.js b/packages/toolkits/pro/template/server/nestJs/nest.js new file mode 100644 index 00000000..e69de29b diff --git a/packages/toolkits/pro/template/server/springCloud/spingCloud.js b/packages/toolkits/pro/template/server/springCloud/spingCloud.js new file mode 100644 index 00000000..e69de29b diff --git a/packages/toolkits/pro/template/tinyvue/package.json b/packages/toolkits/pro/template/tinyvue/package.json index 6379d6c7..81f5f2f6 100644 --- a/packages/toolkits/pro/template/tinyvue/package.json +++ b/packages/toolkits/pro/template/tinyvue/package.json @@ -28,7 +28,7 @@ ] }, "dependencies": { - "@opentiny/hwc-client": "^0.0.12", + "@opentiny/hwc-client": "^0.0.14", "@opentiny/vue": "^3.6.8", "@types/mockjs": "^1.0.4", "@vueuse/core": "^7.3.0", diff --git a/packages/toolkits/pro/template/tinyvue/src/env.d.ts b/packages/toolkits/pro/template/tinyvue/src/env.d.ts deleted file mode 100644 index ffbc1889..00000000 --- a/packages/toolkits/pro/template/tinyvue/src/env.d.ts +++ /dev/null @@ -1,27 +0,0 @@ -/// - -declare module '*.vue' { - import { DefineComponent } from 'vue'; - // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types - const component: DefineComponent<{}, {}, any>; - export default component; -} - -declare module 'vue/types/vue' { - interface Vue { - $echarts: any; - } -} - -interface ImportMetaEnv { - readonly VITE_API_BASE_URL: string; - VITE_USE_MOCK :boolean; -} - -declare module '@opentiny/vue-locale'; -declare module '@opentiny/vue'; -declare module '@opentiny/vue-icon'; -declare module '@opentiny/vue-theme/theme-tool.js'; -declare module '@opentiny/vue-theme/theme'; -declare module 'echarts4'; -declare module 'query-string';