electroin-vue模板及项目创建

最新推荐文章于 2024-04-30 20:20:36 发布

weixin_43440746

最新推荐文章于 2024-04-30 20:20:36 发布

阅读量193

点赞数

分类专栏： electron-vue&vue-cli

本文链接：https://blog.csdn.net/weixin_43440746/article/details/104011534

版权

electron-vue&vue-cli 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

Windows环境配置

1. 安装Node.js
下载最新版本的Node.js 。选择Windows Installer。下载完成后，执行安装程序，根据引导完成安装即可。
在安装过程中的配置界面, 请勾选 Node.js runtime、npm package manager和Add to PATH
安装完成后，打开PowerShell，通过以下命令来确认 node 和 npm已经安装成功：
```
#下面这行的命令会打印出Node.js的版本信息
node -v
#下面这行的命令会打印出npm的版本信息
npm -v
```
如果上述命令均打印出一个版本号，就说明Node.js已经安装好了！

2. 配置npm下载镜像

配置淘宝镜像

 npm config set registry https://registry.npm.taobao.org

3. 下载vue-cli
vue-cli官方文档

如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x)，你需要先卸载它。通过命令：
npm uninstall vue-cli -g
可以使用下列命令安装新的包：
npm install -g @vue/cli
安装之后，你就可以在命令行中访问 vue 命令。用这个命令来检查其版本是否正确:
vue --version

4. 安装git
直接在官网下载exe安装包。

构建electron-vue

1. 将electron-vue项目先下载下来

electron-vue国内码云地址，直接下载到本地。

或通过git直接克隆到本地

git clone https://gitee.com/mirrors/electron-vue.gi

2. 安装样板代码

F:\electron\electron-vue 是我下载下来后的项目路径( 根据自己下载的位置自行调整，之后根据如下代码，即可快速构建项目模板。

vue init F:\electron_pro\electron-vue doem
# doem 为你自己的项目名

3. 安装依赖并运行

安装依赖
进入到你的项目文件夹，打开终端：

npm install

运行

npm run dev

问题：

1. ReferenceError: process is not defined
处理：将node.js还原到v10.16.0的稳定版。重新构建。
或者直接在index.ejs中把下面的代码去除掉，就行了。
在<body>里面：

<!-- Set `__static` path to static files in production -->
<% if (!process.browser) { %>
  <script>
    if (process.env.NODE_ENV !== 'development') window.__static = require('path').join(__dirname, '/static').replace(/\\/g, '\\\\')
  </script>
<% } %>