vux+koa2+mongodb 项目的环境搭建

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_31126175/article/details/79709002

vux+koa2+mongodb 项目的环境搭建

一. 搭建vux脚手架

1. 准备

1.安装node.js,从node.js官网下载并安装node,安装过程很简单,一路“下一步”就可以了(傻瓜式安装)。安装完成之后,打开命令行工具(win+r,然后输入cmd),
node -v//显示node版本
npm -v //显示npm版本号
2.nmp镜像
Cmd命令行中输入
通过npm使用
npm config set registry https://registry.npm.taobao.org
通过cnpm使用
npm install -g cnpm –registry=https://registry.npm.taobao.org
3.安装vue脚手架工具vue-cli
npm install -g vue-cli
vue –version //显示版本

2. 搭建

在所工作的目录下,搭建项目
vue init airyland/vux2 项目名称
这里写图片描述
cd 项目名称
npm i
npm run dev
访问地址 localhost:8080

3. 访问后台请求

安装 axios
npm i axios

4.使用store

安装vuex
npm i vuex
(项目已经安装过了)
并创建文件
store文件夹,store.js
1.main.js添加

//引入vuex文件
import store from './store/store.js'//注意文件路径

2.store文件夹下的store.js

//引入我们的vue和vuex。
import Vue from 'vue'
import Vuex from 'vuex'
//使用我们vuex,引入之后用Vue.use进行引用
Vue.use(Vuex);

二. 搭建koa2

1. 快速搭建

安装koa-generator
在终端输入:
$ npm install -g koa-generator
在你的工作目录下,输入:
$ koa2 项目名称
$ cd 项目名称
$ npm install
1.3 启动项目
$ npm start
访问地址 localhost:3000

2.解决前后端跨域问题

因为前端框架端口是8080,后端是3000,所以请求需要跨域。
安装koa2-cors
npm i koa2-cors

app.js 文件添加

var cors = require('koa2-cors');
app.use(cors());

3.mongoose安装

为了使用mongodb数据库
npm i mongoose
app.js写入

//数据结构表存入数据库
require('./lib/dbHelper')
//连接数据库
mongoose.connect(
  `mongodb://localhost:27017/hr`
);
mongoose.connection.on('open', function () {
  console.log('数据库连接成功!');
});

三. 搭建mongodb

正常下载安装mongodb,官网链接
配置环境变量。
新建一个文件夹,放数据库表等信息 如 D:\My_DB。
启动mongodb
mongod --dbpath D:\My_DB

猜你喜欢

转载自blog.csdn.net/qq_31126175/article/details/79709002