# magical.mind.map

**Repository Path**: weizhe-wz/magical.mind.map

## Basic Information

- **Project Name**: magical.mind.map
- **Description**: magical.mind.map（思维导图项目开发）
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2021-06-18
- **Last Updated**: 2021-09-04

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

## magical.mind.map（思维导图项目开发）

#### 使用框架：
  **node：** v14.16.1；  
  **vue-cli：** @vue/cli 4.5.13；    

#### 安装electron： 
```
cnpm i -g electron
cnpm i -g electron-builder
```
#### 创建vue-cli项目： 
```
vue create magical.mind.map  
```
#### 选择自定义安装：
```
Manually select features
```

### 选择模块：
```
选择yarn安装
babek：转码器es6->es5；
router：vue路由；
vueX：vue状态管理；
css：css预处理器；
linter：代码风格检查和格式化；
Use history mode for router：选择n不使用history模式；
Pick a CSS pre-processor ：使用node-sass预处理器
Pick a linter / formatter config：选择ESLint + Standard config标准配置；
Pick additional lint features：lint on save保存代码的时候检查格式
Where do you prefer placing config for Babel, PostCSS, ESLint, etc.?：选择In dedicated config files放在各自专用的配置文件中
element：ui框架
```
#### 使用框架：
  **cd magical.mind.map**  
  **yarn serve**

#### 成功之后：
#####   安装electron选择最新版本

    **vue add electron-builder**

#####   运行项目
    **yarn e:serve**  

#####   效果展示：
&emsp;&emsp;&emsp;&emsp;<img src="./mdResources/image/1.0.png" width = "400" alt="图片名称"/>

#### 打包：
&emsp;&emsp;**yarn electron:build**  

&emsp;&emsp;打包完成后，项目下会多出一个 **dist_electron** 的文件夹，该文件夹下有一个 **magical.mind.map Setup 0.1.0.exe** 的应用程序安装包，双击可进行安装， 因为这里没有进行配置，会是默认的安装路径 **（C盘）**，并会在桌面创建一个该程序的快捷方式。

&emsp;&emsp;**dist_electron\win-unpacked** 此下有一个无须安装的绿色版本，故也可将 **win-unpacked** 整个 发给别人安装。  

#### 打包报错：
#### &emsp;&emsp;win 10 系统：
&emsp;&emsp;&emsp;&emsp;按 **win+r** ，查询 **%AppData%** 文件夹在 **Local** 文件夹下找到 **electron-builder** 文件夹
#### &emsp;&emsp;nsis报错：
&emsp;&emsp;&emsp;&emsp;根据报错提取 **nsis** 的文件然后下载解压在 **nsis** 文件夹下  
&emsp;&emsp;&emsp;&emsp;<img src="./mdResources/image/1.1.png" height = "200" alt="nsis"/>
&emsp;&emsp;<img src="./mdResources/image/1.2.png" height = "200" alt="nsis"/>

#### &emsp;&emsp;nsis-resources 报错根据报错提取 nsis-resources 的文件然后下载解压在nsis文件夹下
&emsp;&emsp;&emsp;&emsp;<img src="./mdResources/image/1.3.png" height = "200" alt="nsis-resources"/>
&emsp;&emsp;<img src="./mdResources/image/1.4.png" height = "200" alt="nsis-resources"/>

#### &emsp;&emsp; electron-v12.0.11-win32-ia32 报错，根据报错提取文件然后下载解压在 electron\Cache 文件夹下
&emsp;&emsp;&emsp;&emsp;<img src="./mdResources/image/1.5.png" height = "200" alt="electron-v12.0.11-win32-ia32"/>