下载安装
下载vuethink,git clone https://github.com/honraytech/VueThink.git
,下载好后可以看到VueThink目录中有frontEnd和php,frontEnd是vue-cli脚手架搭建的前端模块,php里面是thinkphp5框架
本地域名
DocumentRoot "E:\wamp\www\VueThink"
ServerName vt.com
后端配置
新建一个数据库,将php下的install.sql
导进新建的数据库,然后配置php下的config/database.php
;配好后打开浏览器访问http://vt.com/php/
,如果看到‘vuethink接口’的字样就是成功了
前端配置
打开frontEnd/src/main.js
// 将HOST改成后台地址
axios.defaults.baseURL = 'http://vt.com/php/index.php'
window.HOST = 'http://vt.com/php/index.php'
配置完后在frontEnd
中npm run dev
运行开发版(localhost:8080或者vt.com:8080),npm run build
打包发布版,将build生成的dist下的static
目录和index.html
拷贝至VueThink
目录下,在浏览器输入vt.com就可以访问了
其它问题
- eslint报错
你可能遇到eslint的疯狂报错,打开frontEnd/build/webpack.base.conf.js
,将eslint配置注释掉
eslint: {
// configFile: './.eslintrc.json'
},
module: {
preLoaders: [
// {
// test: /\.js$/,
// exclude: /node_modules/,
// loader: 'eslint'
// },
// {
// test: /\.vue$/,
// exclude: /node_modules/,
// loader: 'eslint'
// }
],
- build打包后刷新not found问题
这是vue-router的history模式的问题,在VueThink下建个.htaccess
文件,保存下面配置
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>
如果不是Apache请查看详细文档,或者直接将路由模式改回默认的hash模式(如果对路由不讲究的话)
const router = new VueRouter({
mode: 'hash',
base: __dirname,
routes
})
最终结构
VueThink
php // tp5
frontEnd // 开发版、脚手架
static // 打包后的静态资源
index.html // 打包后的入口文件
.htaccess // 配置文件
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。