# java_web_vue

**Repository Path**: houyang99/java_web_backstage

## Basic Information

- **Project Name**: java_web_vue
- **Description**: javaweb课程设计-个人博客前端(vue2)
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 2
- **Forks**: 0
- **Created**: 2022-10-24
- **Last Updated**: 2024-12-04

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 个人博客前端
> 后端代码请移步 [后端](https://gitee.com/baosu666/blog)

## 项目开发时环境

| 依赖         | 版本              | 描述             |
| ------------ | ----------------- | ---------------- |
| NodeJs (Npm) | v14.15.3 (6.14.9) | js解释器本地环境 |
| @vue/cli     | 5.0.8             | Vue脚手架        |

**Node下载**

[node-v14.15.3-x64.msi NodeJs v14.15.3 64位Windows版下载](https://nodejs.org/download/release/v14.15.3/node-v14.15.3-x64.msi)

**项目结构**

web-vue2:

- **node_modules node** 依赖目录，存放需要使用的模块文件（非常大）`npm install` 后下载的依赖在此目录
- **public** 公共文件存放目录
- **src** 源码
  - **assets** 一般存放公共的样式，资源
  - **App.vue** Vue项目的根文件，所有的组件都会在此组件上进行加载和渲染
  - **components** 存放以.vue为后缀的组件
  - **main.js** Vue项目的主函数，再次进行初始化（会默认生成）
  - **router** 路由目录
  - **util** 存放公共的工具，由自己编写
  - **views** 视图目录，在此项目中和 **components** 作用基本一样，存放vue组件
- **.env.development** 环境变量文件
-  **.env.production** 环境变量文件
-  **package.json** 依赖版本信息，npm install后会根据此文件的信息下载所需的依赖
- **vue.config.js** vue配置文件，反向代理配置等
- ……

## 项目运行

> 前提： 安装有NodeJs环境

### 安装依赖

```
npm install
```

### 启动项目
```
npm run serve
```

启动后会有如下提示

```shell
 DONE  Compiled successfully in 258ms                                                                                  下午7:23:36


  App running at:
  - Local:   http://localhost:8080/
  - Network: http://192.168.0.224:8080/
```

> 需保证后端服务已启动

浏览器访问 http://localhost:8080/ 或者第二个地址即可访问项目

后台地址：http://localhost:8080/admin 用户名 admin 密码 123456



### 打包（上线时使用）

```
npm run build
```