VueJS 项目发布部署到服务器 修改目录结构

在真实部署环境中，很难将dist生成的内容直接部署到服务器根目录。直接按默认配置build的项目无法在子文件夹中正常运行，需要进行如下配置：

例如：
将项目部署到服务器根目录下的demo文件夹下：

修改Router index.js

Path：./src/router/index.js

Vue.use(Router)
export default new Router({
  mode: 'history', // 需要增加的地方
  base: '/demo/', // 需要增加的地方
  routes: [
    {
      path: '/',
      name: 'HomePage',

修改config index.js

Path：./config/index.js

module.exports = {
  build: {
    env: require('./prod.env'),
    index: path.resolve(__dirname, '../dist/index.html'),
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '/demo/', // 需要修改的地方
    productionSourceMap: true,

此时，可以将build打包内容全部放入服务器根目录下的demo文件中，并正常访问了。

但是，现在刷新会有问题，需要开启服务器的重写功能。
VueJS官方指导文档

Apache服务器例子：

修改配置文件

# vim /etc/httpd/conf/httpd.conf

1. 搜索<Directory />，修改成：

<Directory />    
Options FollowSymLinks    
AllowOverride None    
Order deny,allow    
Allow from all    
Satisfy all
</Directory>

2. 搜索<Directory "/var/www/html，修改其中一行：

AllowOverride all

在最后一行插入：

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_URL} ^/demo
  RewriteRule . /demo/index.html [L]
</IfModule>

3. 重启Apache服务

# systemctl restart httpd
或：
# service httpd restart

The end.