ScriptEcho Generator插件

欢迎使用ScriptEcho Generator插件，这是一个专为开发者设计的Visual Studio Code扩展，旨在简化项目配置和开发流程。通过本插件，您可以轻松管理在您的项目里使用Script Echo，并快速启动开发环境。

功能特点

• 自动配置：一键添加scriptecho.json配置文件到您的项目中。
• 灵活设置：自定义项目ID、分包名称、端口和路由模式。
• 快速开发：快速运行项目。
• 便捷操作：通过VSCode命令面板快速生成代码并保存到本地。

安装指南

1. 在Visual Studio Code中，打开扩展市场。
2. 搜索ScriptEcho Generator。
3. 点击安装。

使用方法

1. 从模板库拉取代码，参考各框架启动配置。
2. 根据提示填写或修改scriptecho.json配置：参考各框架启动配置。
3. 保存配置文件。
4. 在项目根目录启动项目，参考各框架启动配置。
5. 在VSCode中按下Command + Shift + P（Mac）或Ctrl + Shift + P（Windows/Linux）打开命令面板。
6. 输入Generator Code并选择该命令。
7. 在弹出的页面里进行代码生成。

配置说明

各框架启动配置

Vue3 (jeecg、ruoyi、ant-design-vue3、element-plus、vant、vuetify)

拉取代码

git clone git@github.com:ScriptEcho-ai/ScriptEcho-JeecgTemplate.git
git clone git@github.com:ScriptEcho-ai/ScriptEcho-RuoyiTemplate.git
git clone git@github.com:ScriptEcho-ai/ScriptEcho-AntDesignVue3Template.git
git clone git@github.com:ScriptEcho-ai/ScriptEcho-VantVue3Template.git
git clone git@github.com:ScriptEcho-ai/ScriptEcho-ElementPlusTemplate.git
git clone git@github.com:ScriptEcho-ai/ScriptEcho-VuetifyTemplate.git

启动

npm install
npm run server

配置

{
  "host": "https://admin.scriptecho.cn", // 访问地址
  "framework": "vue3",
  "routeFile": "src/router/scriptecho.js", // 路由文件
  "codeDir": "src/views", // 代码目录
  "projectId": "798d27fa242412c9c95e52d8ae8a20ad", // 项目ID，必填
  "port": "3000", // 端口，不填默认为5173
  "routerMode": "history" // 路由模式（hash，history）
}

Uniapp (uniapp、uview)

拉取代码

git clone git@github.com:ScriptEcho-ai/ScriptEcho-UniappTemplate.git
git clone git@github.com:ScriptEcho-ai/ScriptEcho-UviewTemplate.git

启动

npm install
npm run dev:h5

配置

{
  "host": "https://admin.scriptecho.cn", // 访问地址
  "framework": "uniapp",
  "routeFile": "src/pages.json", // 路由文件
  "codeDir": "src/pages", // 代码目录
  "projectId": "7f5e22b8301882bf2df1c2c2bd30b397", // 项目ID，必填
  "port": "5173", // 端口，不填默认为5173
  "routerMode": "hash" // 路由模式（hash，history），参考src/manifest.json中的h5.router.mode，默认为hash
}

React

拉取代码

git clone git@github.com:ScriptEcho-ai/ScriptEcho-ReactTemplate.git

启动

npm install
npm run start

配置

{
  "host": "https://admin.scriptecho.cn", // 访问地址
  "framework": "react", 
  "routeFile": "src/App.tsx", // 路由文件
  "codeDir": "src", // 代码目录
  "projectId": "7f5e22b8301882bf2df1c2c2bd30b397", // 项目ID，必填
  "port": "3700", // 端口，不填默认为5173
  "routerMode": "history" // 路由模式（hash，history）
}

React Native

拉取代码

git clone git@github.com:ScriptEcho-ai/ScriptEcho-ReactNativeTemplate.git

启动

npm install
npm run start

配置

{
  "host": "https://admin.scriptecho.cn", // 访问地址
  "framework": "react-native", 
  "routeFile": "src/App.tsx", // 路由文件
  "codeDir": "src", // 代码目录
  "projectId": "7f5e22b8301882bf2df1c2c2bd30b397", // 项目ID，必填
  "port": "3700", // 端口，不填默认为5173
  "routerMode": "history" // 路由模式（hash，history）
}

Flutter

拉取代码

git clone git@github.com:ScriptEcho-ai/ScriptEcho-FlutterTemplate.git

启动

flutter pub get
flutter run -d chrome --web-port=7000

热加载配置

代码生成完成后，需要在终端按r进行restart重新加载。

配置

{
  "host": "https://admin.scriptecho.cn", // 访问地址
  "framework": "flutter",
  "routeFile": "lib/routes.dart", // 路由文件
  "codeDir": "lib", // 代码目录
  "projectId": "db838b64ce3d733cd6570fa6148bfd04", // 项目ID，必填
  "port": "7000", // 端口，不填默认为5173
  "routerMode": "hash" // 路由模式（hash，history）
}

注意事项

• 确保您的项目中已安装必要的依赖。
• 如果端口被占用，请修改scriptecho.json中的port字段。
• 路由模式的选择会影响页面的URL结构，请根据项目需求选择合适的模式。

反馈与支持

如果您在使用过程中遇到任何问题，或有任何建议，请通过插件市场页面联系我们。我们期待您的反馈，以帮助我们不断改进插件。

感谢您选择ScriptEcho Generator插件，祝您开发愉快！