• nginx 配置,关键参数:
server {
  listen 80;
  server_name xxx.xxx.xxx.xxx;
  charset utf-8;
  root /home/xxx/dist/;
  index index.html;
  location / {
    try_files $uri $uri/ @rewrites; #需要指向下面的@rewrites,否则会出现vue的路由在nginx中刷新出现404
  }
  #对应上面的@rewrites,主要原因是路由的路径资源并不是一个真实的路径,所以无法找到具体的文件
  #因此需要rewrite到index.html中,然后交给路由在处理请求资源
  location @rewrites {
    rewrite ^(.+)$ /index.html last;
  }
  location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|js|css|svg|ttf|otf|eot|woff|woff2)$ {
    expires 30d;
  }
}

vue-cli 创建的项目,在 nginx 上配置启用浏览器缓存的更多相关文章

  1. vue cli创建typescript项目

    使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本 安装命令 npm install -g @vue-cli 创建项目 vue cre ...

  2. vue cli创建的项目 当你后期使用了ES6语法,如何解决浏览器兼容问题

    最近开发了一个项目,开发过程中,由于需要使用了async await ,于是发现,只有少数的浏览器支持,极大多数的浏览器是不支持这玩意的,在网上各种找解决方案,基本都是失败,最后总结了两个方案之后,尝 ...

  3. 用vue ui创建的项目怎么关闭eslint校验

    在Vue Cli的控制面板找到配置-ESLint configuration,然后关闭保存时检查就可以了

  4. 解决@vue/cli 创建项目是安装chromedriver时失败的问题

    最近在使用新版vue的命令行工具创建项目时,安装chromedriver老是失败,导致后面的步骤也没有进行.网上搜索了一下,全是使用 工作中常见问题汇总及解决方案 npm install chrome ...

  5. 用Angule Cli创建Angular项目

    Angular4.0来了,更小,更快,改动少 接下来为Angular4.0准备环境和学会使用Angular cli项目 1.环境准备: 1)在开始工作之前我们必须设置好开发环境 如果你的机器上还没有安 ...

  6. 用vue脚手架创建bootstrap-vue项目

    用vue脚手架创建bootstrap-vue项目 框架的地址:https://bootstrap-vue.js.org/docs/ 第一步 vue init webpack demo第二步 cd de ...

  7. apache上.htaccess转向nginx上配置.htaccess伪静态规则

    nginx上配置.htaccess伪静态规则 在apache上.htaccess转向,只要apache编译的时候指明支持rewrite模块即可. 但是换到nginx上方法会有不同,有人说把.htacc ...

  8. Nginx使用Expires增加浏览器缓存加速(转)

    转载自:Nginx使用Expires增加浏览器缓存加速 Nginx可以更改HTTP头部,这个是Web服务器必须的,当然Nginx更可以支持在HTTP头部中添加Expires等相关信息,增强浏览器缓存, ...

  9. Vue CLI 创建项目

    使用命令创建VUE项目 运行以下命令[vue create [项目名]]来创建一个新项目: vue create hello-world 警告 如果你在 Windows 上通过 minTTY 使用 G ...

随机推荐

  1. SharePoint Framework 企业向导(八)

    博客地址:http://blog.csdn.net/FoxDave 构建关于SPFx自定义的计划 在SPFx引入的时候,你就需要对它进行规划了.规划要从介绍SPFx解决方案使用的新的技术栈开始.开 ...

  2. linux程序的常用保护机制

    操作系统提供了许多安全机制来尝试降低或阻止缓冲区溢出攻击带来的安全风险,包括DEP.ASLR等.在编写漏洞利用代码的时候,需要特别注意目标进程是否开启了DEP(Linux下对应NX).ASLR(Lin ...

  3. Java语法基础DayFive

    一.继承 1.格式:class 子类 extends 父类 2.好处:提高代码的复用性:让类与类之间产生了关系,是多态的前提. 3.弊端: (1)类的耦合性增强了,而开发的原则是高内聚,低耦合.内聚是 ...

  4. JavaScript和它父亲的故事

    附赠脱单秘籍:了解一些JavaScript的历史,聊天的时候说不好可以获得更多程序员小妹子的崇拜的哟~ ๑乛◡乛๑~ 阅读本文可以让你更好的理解什么是ECMAScript. 本次文章内容来自:< ...

  5. MySQL:数据表基本操作

    数据表基本操作 注意点: 1.数据表中已经有数据时,轻易修改数据类型,有可能因为不同的数据类型的数据在机器 中存储的方式及长度并不相同,修改数据类型可能会影响到数据表中已有的数据类型. 2.  数据表 ...

  6. python 一次创建多级目录

    python 一次创建多级目录沙漠骆驼:qq音乐import osos.mkdirs('/home/user/app')

  7. Python 实例变量

    class Person: def __init__(self, name, id, gender, birth): self.name = name # 实例变量 对象里的变量 self.id = ...

  8. [转]JavaScript与元素间的抛物线轨迹运动

    在张鑫旭的博客看到这个抛物线的小动画,觉得很感兴趣,转载一下方便研究~ 原文地址:http://www.zhangxinxu.com/wordpress/?p=3855 在页面上添加元素的位移动画,除 ...

  9. Vue 之 element-ui upload组件的文件类型

    在使用element-ui的upload上传组件的时候,有时候会遇到 控制上传文件类型 的需求,只需要配置accept属性为允许的类型即可,比如: <el-upload class=" ...

  10. str 类型

    1.capitalize():首字母大写 2.center(size,fillwith): 3.count(sub,start,end):计算子序列的个数 4.decode() 5.encode() ...