项目描述
使用 vue-cli 可以快速创建 vue 项目，使用 nuxt 可以快速创建 带有SSR服务端渲染的vue 项目，vue-cli很好用，nuxt也很好用，但是在最初搭建环境安装vue-cli及nuxt相关内容的时候，对一些人来说是很头疼的一件事情，特此写了一篇搭建环境的教程，每一步尽量详细解析。需要的朋友可以过来参考下，同时本项目也是vue中文社区周刊升级版实战项目，喜欢的可以到github点波star，希望可以帮到大家。
weeklyPlus vue中文社区周刊服务端渲染升级版weeklyPlus
github源码下载地址：https://github.com/wuyanwen/weeklyPlus - 欢迎star
引言
- 为什么要做一个这样的weeklyPlus系统?
- 可以做为知识的沉淀
- 可以熟悉最前沿且不仅限于前端的最新知识
- 可以传播到更多的需要这些知识的同学们
- 圈内已经有很多weekly系统了，weeklyPlus有什么不同吗?
- 我们保证是有态度（不求多，只求精）的周刊
- 我们保证发的每一篇文章都是有意义的
- 我们是open source ，欢迎每一位同学添砖加瓦
技术栈
- nuxt - vue 服务端渲染框架
- vue-cli - Vue.js 提供的官方命令行工具，可用于快速搭建大型单页应用
- mongodb - 数据库
- koa - 公开 API 接口
- element-ui - 基础组件库
- axios - http 请求
-
less - 一种动态样式语言
web 应用功能
-
周刊系统列表
- 周刊后台权限控制
- 周刊后台登录功能
- 周刊后台分类增删改查功能
- 周刊后台内容增删改查功能
开发部署
1.安装node.js
在node.js中文官网正常下载安装node.js就可以，没有什么特别需要注意的点（傻瓜式安装）。
在官网下载安装node.js后，就已经自带npm（包管理工具），不需要另外再进行安装npm了。
注意下载node.js版本最好要在node7.6以上，避免版本过低影响使用。这里强烈推荐大家安装node版本管理工具nvm。
打开命令行工具（随便哪个文件夹），输入命令行 node -v，npm -v，如果出现相应的版本号，则说明安装成功。
2.运行weekplus项目
本项目用的数据库是mongdb,开启mongdb,端口设为10086，强烈建议大家安装mongdb的客户端数据MongoChef可视化管理数据。
# 1. 切换到server文件夹,依次执行以下命令
$ npm install
$ npm run start
# 2. 切换到admin文件夹,依次执行以下命令
$ npm install
$ npm run start
# 3. 切回到项目根目录,
$ npm install
$ npm run dev注意
- mongdb 数据库启动的服务端号是10086
- server 文件夹启动的服务端号是1111
- admin 文件夹启动的服务端号是2222,后台入口默认地址 http://localhost:2222/#/admin
- 前台默认启动的服务端口号是3333,前台入口默认地址 http://localhost:3333/
最后
- 欢迎 issue 和 pr
- 欢迎加入前端实战交流QQ群: 541024234
