栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > Vue.js

多项目vue-router去掉#

Vue.js 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

多项目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/',        

        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

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/241128.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号