# vue_webpack_frame

**Repository Path**: foge/vue_webpack_frame

## Basic Information

- **Project Name**: vue_webpack_frame
- **Description**: vue+webpack+sass+element框架
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2019-08-05
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# vue_webpack_frame


### 软件架构
```
佛哥亲情推出的基于Vue.js 3.10.0 的移动端框架，整合webpack 4.28.3打包工具。
此框架支持功能：
    - webpack打包
    - sass样式
    - element-ui
    - 移动端rem适配
    - 第三方字体库
    - axios的封装
    - api接口管理
    - 浏览器自动开启
    
内含使用案例，能让你快速的进入移动端h5开发。
```


# 安装与使用
```
1.获取代码：git clone https://gitee.com/foge/vue_webpack_frame.git
2.进入源码：cd Source
3.安装依赖：npm install
4.启动程序: npm run dev
5.打包程序: npm run build
```

------------------------------------
# 搭建流程记录

### 搭建vue + webpack框架
```
1、下载nodejs: www.nodejs.org
2、检测nodejs：node -v
3、安装全局vue-cli脚手架：npm install --global vue-cli
4、创建新的项目输入命令：vue init webpack my-project
5、安装依赖：cd my-project,cnpm install
6、测试：cnpm run dev
```

## vue-cli项目打包出现空白页和路径错误问题
```
https://www.cnblogs.com/chenzeyongjsj/p/8079136.html
```

## 安装组件：适配
```
vue移动端适配插件lib-flexible
npm i lib-flexible --save-dev
npm install px2rem-loader --save-dev
https://www.jianshu.com/p/3f38841515cd

```

## vue中使用sass
```
https://blog.csdn.net/mangxi8200/article/details/81005223
```

## 默认浏览器设置及vue自动打开
```
https://www.jianshu.com/p/5b78cf0e2f22
https://www.cnblogs.com/shira-t/p/8471608.html
```

## vue项目中引入字体库
```
https://www.jianshu.com/p/e7329afafb4b

```

## axios的封装、接口管理
```
https://www.cnblogs.com/chaoyuehedy/p/9931146.html
```

## 实际项目中要维护修改：接口路径和base路径
```
Source\src\javascript\http.js
Source\src\javascript\api.js
```


## 设置浏览器图标、ico图标转换网站
```
https://www.jianshu.com/p/32e92379e44e
https://www.easyicon.net/covert/
```






## 参与贡献

佛哥
2019-8-5