<div class="blogpost-body" id="cnblogs_post_body">
<p>看了些 koa2 与 Vue2 的资料,模仿着做了一个基本的后台管理系统,包括增、删、改、查与图片上传。</p>
<p>工程目录:</p>
<p><img alt="" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-d6854a776eb0ccdcbb08b4ca6c6ef27c.png"></p>
<p>由于 <a href="http://koajs.com/" title="koajs.com">koa2</a> 用到了 async await 语法,所以 node 的版本需要至少 v7.6.0,我目前用的是 v7.9.0</p>
<p> </p>
<p>1. 根据 package.json 安装好依赖:</p>
<div class="cnblogs_code">
<img alt="" class="code_img_closed" id="code_img_closed_417c4ff8-c9cd-4a7b-ae87-4c97f9680b87" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-8f900a89c6347c561fdf2122f13be562.gif">
<img alt="" class="code_img_opened" id="code_img_opened_417c4ff8-c9cd-4a7b-ae87-4c97f9680b87" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-961ddebeb323a10fe0623af514929fc1.gif">
<div class="cnblogs_code_hide" id="cnblogs_code_open_417c4ff8-c9cd-4a7b-ae87-4c97f9680b87">
<pre class="blockcode"><span style="color:#000000;">{
</span>"name": "vue2.x-koa2.x"<span style="color:#000000;">,
</span>"version": "1.0.0"<span style="color:#000000;">,
</span>"description": "A Vue.js and Koa project"<span style="color:#000000;">,
</span>"author": "caihuaguang@aixuedai.com <caihuaguang@aixuedai.com>"<span style="color:#000000;">,
</span>"private": <span style="color:#0000ff;">true</span><span style="color:#000000;">,
</span>"scripts"<span style="color:#000000;">: {
</span>"server": "node app.js"<span style="color:#000000;">,
</span>"dev": "node build/dev-server.js"<span style="color:#000000;">,
</span>"build": "node build/build.js"<span style="color:#000000;">
},
</span>"dependencies"<span style="color:#000000;">: {
</span>"axios": "^0.15.3"<span style="color:#000000;">,
</span>"bcryptjs": "^2.4.0"<span style="color:#000000;">,
</span>"busboy": "^0.2.14"<span style="color:#000000;">,
</span>"element-ui": "^1.2.7"<span style="color:#000000;">,
</span>"koa": "^2.2.0"<span style="color:#000000;">,
</span>"koa-bodyparser": "^4.2.0"<span style="color:#000000;">,
</span>"koa-history-api-fallback": "^0.1.3"<span style="color:#000000;">,
</span>"koa-jwt": "^1.3.1"<span style="color:#000000;">,
</span>"koa-logger": "^2.0.1"<span style="color:#000000;">,
</span>"koa-router": "^5.4.0"<span style="color:#000000;">,
</span>"koa-static": "^3.0.0"<span style="color:#000000;">,
</span>"mysql": "^2.12.0"<span style="color:#000000;">,
</span>"sequelize": "^3.30.4"<span style="color:#000000;">,
</span>"stylus": "^0.54.5"<span style="color:#000000;">,
</span>"stylus-loader": "^2.4.0"<span style="color:#000000;">,
</span>"vue": "^2.2.6"<span style="color:#000000;">,
</span>"vue-router": "^2.3.0"<span style="color:#000000;">,
</span>"vuex": "^2.2.1"<span style="color:#000000;">
},
</span>"devDependencies"<span style="color:#000000;">: {
</span>"autoprefixer": "^6.4.0"<span style="color:#000000;">,
</span>"babel-core": "^6.24.0"<span style="color:#000000;">,
</span>"babel-loader": "^6.4.1"<span style="color:#000000;">,
</span>"babel-plugin-transform-runtime": "^6.23.0"<span style="color:#000000;">,
</span>"babel-preset-es2015": "^6.24.0"<span style="color:#000000;">,
</span>"babel-preset-stage-0": "^6.22.0"<span style="color:#000000;">,
</span>"babel-register": "^6.24.0"<span style="color:#000000;">,
</span>"chalk": "^1.1.3"<span style="color:#000000;">,
</span>"connect-history-api-fallback": "^1.1.0"<span style="color:#000000;">,
</span>"css-loader": "^0.25.0"<span style="color:#000000;">,
</span>"eventsource-polyfill": "^0.9.6"<span style="color:#000000;">,
</span>"express": "^4.13.3"<span style="color:#000000;">,
</span>"extract-text-webpack-plugin": "^1.0.1"<span style="color:#000000;">,
</span>"file-loader": "^0.9.0"<span style="color:#000000;">,
</span>"friendly-errors-webpack-plugin": "^1.1.2"<span style="color:#000000;">,
</span>"function-bind": "^1.0.2"<span style="color:#000000;">,
</span>"html-webpack-plugin": "^2.8.1"<span style="color:#000000;">,
</span>"http-proxy-middleware": "^0.17.2"<span style="color:#000000;">,
</span>"json-loader": "^0.5.4"<span style="color:#000000;">,
</span>"opn": "^4.0.2"<span style="color:#000000;">,
</span>"ora": "^0.3.0"<span style="color:#000000;">,
</span>"semver": "^5.3.0"<span style="color:#000000;">,
</span>"shelljs": "^0.7.4"<span style="color:#000000;">,
</span>"url-loader": "^0.5.7"<span |
|