使用Wampserver配置域名（laravel和vue前后端分离项目）（vue2）

Posted 2020-12-16 Bing-haha

1、安装wampserver

2、在wampserver3下快速配置多站点多目录

https://www.cnblogs.com/WalAmar/p/6136110.html

3、复制目录下的.env.example 重命名为.env

配置好数据库：

DB_CONNECTION=mysql
DB_HOST=localhost
DB_PORT=3306
DB_DATABASE=datanet
DB_USERNAME=root
DB_PASSWORD=123456

 

 

 4、配置apatch的另外两个文件：

参考：

https://blog.csdn.net/qq_37391017/article/details/82978956

https://www.cnblogs.com/qy123/p/7092470.html

注意：

站点的目录是文件的目录，要具体到public文件夹下，因为public文件夹才可以被访问

参考：

# Virtual Hosts
#
<VirtualHost *:80>
  ServerName localhost
  ServerAlias localhost
  DocumentRoot "${INSTALL_DIR}/www"
  <Directory "${INSTALL_DIR}/www/">
    Options +Indexes +Includes +FollowSymLinks +MultiViews
    AllowOverride All
    Require local
  </Directory>
</VirtualHost>

<VirtualHost *:80>
  ServerName datanet.cc
  DocumentRoot "D:\\projects\\project\\firmProject\\Datanet\\datanet\\public"
  <Directory "D:\\projects\\project\\firmProject\\Datanet\\datanet\\public">
    Options +Indexes +Includes +FollowSymLinks +MultiViews
    AllowOverride All
    Require all granted
  </Directory>
</VirtualHost>

5、配置web目录下的dev.env.js

修改BASE_API：

这是原本的dev.env.js：

\'use strict\'
const merge = require(\'webpack-merge\')
const prodEnv = require(\'./prod.env\')

module.exports = merge(prodEnv, {
  NODE_ENV: \'"development"\',
  BASE_API: \'"http://your-site.homestead/api"\',
})

这是修改后的，主要修改http后面的为你配置的域名

\'use strict\'
const merge = require(\'webpack-merge\')
const prodEnv = require(\'./prod.env\')

module.exports = merge(prodEnv, {
  NODE_ENV: \'"development"\',
  BASE_API: \'"http://datanet.cc/api"\'
})

6、修改完所有的后，重启服务

wampserver重启服务