多项目vue-router去掉#

-大家很容易想到,去掉#不就是在配置路由的时候设置路由的模式为history吗,没错,的确是这样,但是这仅限于单页面应用
-而在实际工作中,经常是多项目开发

1、创建两个或者多个项目设置路由模式为history

export default new Router({    base: '/demo/', 
    mode: 'history',
    routes: [{
            path: '/',
            name: 'HelloWorld',
            component: HelloWorld
        },
        {            path: '/about',
            name: 'about',
            component: About
        },
        {            path: '/works',
            name: 'works',
            component: Works
        }
    ]
})

base参数必须要配置

2、打包（npm run build）

 build: {        // Template for index.html
        index: path.resolve(__dirname, '../dist/index.html'),        // Paths
        assetsRoot: path.resolve(__dirname, '../dist'),        assetsSubDirectory: 'static',        assetsPublicPath: '/demo/',        /**
         * Source Maps
         */

        productionSourceMap: true,        // https://webpack.js.org/configuration/devtool/#production
        devtool: '#source-map',        // Gzip off by default as many popular static hosts such as
        // Surge or Netlify already gzip all static assets for you.
        // Before setting to `true`, make sure to:
        // npm install --save-dev compression-webpack-plugin
        productionGzip: false,        productionGzipExtensions: ['js', 'css'],        // Run the build command with an extra argument to
        // View the bundle analyzer report after build finishes:
        // `npm run build --report`
        // Set to `true` or `false` to always turn it on or off
        bundleAnalyzerReport: process.env.npm_config_report
    }

在config的index.js 的生产环境的参数设置assetPublicPath路径

3、配置nginx的nginx.conf

location ^~ /demo/ {
            try_files $uri $uri/ /demo/index.html;
        }
location ^~ /subDemo/ {
            try_files $uri $uri/ /subDemo/index.html;
        }

我这里是两个项目demo和subDemo，主要步骤就到这里了
附:[vue多项目部署]（https://blog.csdn.net/echo008/article/details/77098142）

作者：南蓝NL
链接：https://www.jianshu.com/p/1fcac993bf09