• 中文
  • 注册
    • 查看作者
    • nuxt中static里面放入图片不出来

      查看了static和assets的区别后,决定将图片们放在static下。但路径是在JS中生成的,结果没有显示出来,浏览器标签中后面跟个括号,里面写1x1px,经过尝试也了解到很多知识点:

      js中拼路径时表示根路径的动态参数@和~不能正常解析;

      即使根据logo等图片地址的规律,在前面加上“_nuxt/”,仍然访问不到;

      后来查得:

      如果你的静态资源文件需要 Webpack 做构建编译处理,可以放到 assets 目录,否则可以放到 static 目录中去。
      Nuxt 服务器启动的时候,该目录下的文件会映射至应用的根路径 / 下,像 robots.txt 或 sitemap.xml 这种类型的文件就很适合放到 static 目录中。
      你可以在代码中使用根路径 / 结合资源相对路径来引用静态资源:
      <!-- 引用 static 目录下的图片 --><img src="/my-image.png"/><!-- 引用 assets 目录下经过 webpack 构建处理后的图片 --><img src="~/assets/my-image-2.png"/>

      于是去掉路径前面的static/,图片就正常显示了。 

    • 0
    • 0
    • 0
    • 146
    • 请登录之后再进行评论

      登录
    • 做任务
    • 发表内容
    • 实时动态

    • 关于伊迪派 | 联系我们 | 免责声明 | 侵权投诉 | 小黑屋

      本站资源来源于互联网,仅供个人学习参考研究之用,请于下载后24小时内删除。
      如有侵犯您的权益,可通过邮件(admin@idepy.com)、站内通道等方式反馈,本网站将在第一时间处理。
      Copyright © 2019 - 2020 伊迪派(IDEPY), All Rights Reserved · 粤ICP备12030819号-6 · 粤公网安备 44132202100185号