文档章节

nginx中部署vue打包后的静态文件

克虏伯
 克虏伯
发布于 2018/12/19 11:37
字数 326
阅读 44
收藏 3

    如何在nginx中部署静态资源就不描述了, 请看我的这篇博客 

    将vue脚手架项目打包后的静态文件放到nginx上, 发现有个问题, 即url上有#, 怎么去掉这个#呢.

1 项目中router的mode

    路由的mode要为history, 如下List-1.1所示

    List-1.1

export default new Router({
  mode: 'history',
  routes: [
    {
...

2 nginx的conf配置

    如下List-2.1所示, root放在server下,而不是 location里面; location里面固定写"try_files $uri $uri/ /index.html;"

    为什么这么写? 请看vue-router官网的说明, 如下图2.1, 看这个链接; 另外将root放到server下, 参考的是这篇文章.

    List-2.1

server {
    #端口
    listen       3009;
    server_name  localhost;
    #这里root的值是放置静态资源的那个目录
    root /usr/share/nginx/army/html;

    #charset koi8-r;
    #access_log  /var/log/nginx/host.access.log  main;

    location / {
        #下面的这行固定, 就这么写 
        try_files $uri $uri/ /index.html;
    }
...

    vue-router官网上有nginx的配置说明, 如下图2.1

               

                                                                                        图2.1

© 著作权归作者所有

共有 人打赏支持
克虏伯

克虏伯

粉丝 16
博文 344
码字总数 115592
作品 0
渝北
程序员
私信 提问
Vue命令行工具vue-cli

Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置,带来现代化的前端开发流程。只需几分钟即可创建并启动一个带热重载、保存时静态检查以及可...

韦姣敏
2018/06/23
0
0
WEB平台DJANGO&VUE配置部署生产环境

在这篇文章中: 整体框架 一、安装和配置nginx 二、安装和配置uwsgi 三、配置访问vue 四、通过supervisor管理进程 中间可能遇到的坑 本文主要讲述了如何一步步在生产环境上部署django和vue,...

fanspring
2018/12/06
0
0
Vue项目History模式404问题解决

本文主要解决Vue项目使用History模式发布到服务器Nginx上刷新页面404问题。(由于每个项目的情况都不尽相同,本方案已经完美解决本在所使用项目,具体情况可能还需要修改。) 1.项目背景分析...

dalaoyang
2018/10/30
0
0
centos Docker nginx 部署 ABP Zero

准备环境: centos7.0 及以上 nginx-1.13.5 以上 docker-ce 1.17 以上 1,更新系统组件: yum update -y API部署 2,准备好编译过的项目文件,一般为publish文件夹全部文件 3,准备dockerfile文...

好烟
2018/04/16
0
0
整合 Django + Vue.js 框架快速搭建web项目

在这篇文章中: 一、 背景 二、 环境准备 三、 构建Django项目 四、 构建Vue.js前端项目 五、 整合Django和Vue.js 六、 部署 七、 其他 一、 背景 在工作中我们经常须要构件一些基于web的项目...

.╂遊牧
2017/08/08
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Windows 上安装 Scala

在安装 Scala 之前需要先安装 Java 环境,具体安装的详细方法就不在这里描述了。 您可以自行搜索我们网站中的内容获得其他网站的帮助来获得如何安装 Java 环境的方法。 接下来,我们可以从 ...

honeymose
今天
1
0
数据库篇多表操作

第1章 多表操作 实际开发中,一个项目通常需要很多张表才能完成。例如:一个商城项目就需要分类表(category)、商品表(products)、订单表(orders)等多张表。且这些表的数据之间存在一定的关系...

stars永恒
今天
3
0
nginx日志自动切割

1.日志配置(Nginx 日志) access.log----记录哪些用户,哪些页面以及用户浏览器,IP等访问信息;error.log------记录服务器错误的日志 #配置日志存储路径:location / {      a...

em_aaron
昨天
5
0
java 反射

基本概念 RTTI,即Run-Time Type Identification,运行时类型识别。RTTI能在运行时就能够自动识别每个编译时已知的类型。   要想理解反射的原理,首先要了解什么是类型信息。Java让我们在运...

细节探索者
昨天
2
0
推荐转载连接

https://www.cnblogs.com/ysocean/p/7409779.html#_label0

小橙子的曼曼
昨天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部