广东专业网站定制,广告线上推广方式,网站建设大概需要多少钱,帮助中心网站怎么做我将结合官网手册与AI问到的信息#xff0c;直接给出步骤#xff0c;与命令。
一、准备环境
首先在C盘Users#xff0c;你的登录的账号名文件夹下#xff0c;编辑.npmrc文件。添加镜像地址。
如果使用了yarn#xff0c;则是.yarnrc。可以全部都配置。
npm install -g …我将结合官网手册与AI问到的信息直接给出步骤与命令。
一、准备环境
首先在C盘Users你的登录的账号名文件夹下编辑.npmrc文件。添加镜像地址。
如果使用了yarn则是.yarnrc。可以全部都配置。
npm install -g yarn
registryhttps://registry.npmmirror.com
ELECTRON_MIRRORhttps://npmmirror.com/mirrors/electron/
npm config set registry https://registry.npm.taobao.org 二、创建Element项目 并使用Electron Forge的 Vite template.
npm init electron-applatest my-vue-app -- --templatevite 三、添加依赖
npm install vue
npm install --save-dev vitejs/plugin-vue 四、配置页面
根目录/index.html
!DOCTYPE html
htmlheadmeta charsetUTF-8 /titleHello World!/title/headbodydiv idapp/divscript typemodule src/src/renderer.js/script/body
/html src/App.vue
templateh1 Hello World!/h1pWelcome to your Electron application./p
/templatescript setup
console.log( This message is being logged by App.vue, included via Vite);
/script src/renderer.js
import { createApp } from vue;
import App from ./App.vue;createApp(App).mount(#app);
根目录/ vite.renderer.config.mjs
import { defineConfig } from vite;
import vue from vitejs/plugin-vue;// https://vitejs.dev/config
export default defineConfig({plugins: [vue()]
});
至此我们创建了基于Vue3的Electron项目。
2-4步骤参考自官网How to create an Electron app with Vue and Electron Forge 五、安装Element-plus
npm install element-plus 六、配置页面
src/renderer.js
// src/renderer.js
import { createApp } from vue;
import App from ./App.vue;
import ElementPlus from element-plus;
import element-plus/dist/index.css;const app createApp(App);
app.use(ElementPlus);
app.mount(#app);src/App.vue
!-- src/App.vue --
templatediv idapph1Hello, Electron Forge with Vue 3 and Element Plus!/h1el-button typeprimaryPrimary Button/el-button/div
/templatescript
export default {name: App
};
/script致此完成。启动 七、增加支持TypeScript 1、安装 TypeScript
npm install -g typescript
2、配置 tsconfig.json 文件
在项目根目录下创建 tsconfig.json 文件这个文件用于配置 TypeScript 编译器选项。你可以通过命令行工具自动生成一个基本配置文件
tsc --init
3、安装 Electron 类型定义
为了获得更好的开发体验包括类型检查和自动完成功能你应该安装 Electron 的类型定义文件。运行以下命令来安装
npm install types/electron --save-dev