NUXT-资产和静态文件夹-何时使用哪个? [英] NUXT- assets and static folder - when to use which?

问题描述

作为 NUXT 的新手，我对资产和静态文件夹之间的区别有点困惑.

Being new to NUXT, I am a bit confused about the difference between the assets and static folders.

在关于这个文件夹的文档中，它说:

in the documentation regarding this folders it says:

每个小于 1 KB 的文件都将作为 base-64 数据 URL 内联.除此以外，图像/字体将被复制到其对应的文件夹中(在.nu​​xt 目录)，其名称包含版本哈希以获得更好的效果缓存.

every file below 1 KB will be inlined as base-64 data URL. Otherwise, the image/font will be copied in its corresponding folder (under the .nuxt directory) with a name containing a version hashes for better caching.

还有:

如果不想使用assets目录下的webpacked Assets，您可以在项目根目录中创建和使用静态目录目录.

If you don't want to use webpacked Assets from the assets directory, you can create and use the static directory in your project root directory.

这些文件将由 Nuxt 自动提供并在您的项目根网址.

These files will be automatically served by Nuxt and accessible in your project root URL.

此选项对 robots.txt、sitemap.xml 或 CNAME 等文件很有帮助(例如 GitHub Pages).

This option is helpful for files like robots.txt, sitemap.xml or CNAME (for like GitHub Pages).

如果我理解正确，静态文件夹中的文件应该是名称不应更改的文件(即对于第 3 方消费者)和资产文件夹中的文件，我不关心它们的名称是否更改(例如文件我在我的页面上使用).

If I understand correctly the files in the static folder should be files that their name should not change(i.e. for 3rd party consumers) and in the assets folder, files that I don't care if their name change(e.g. the files I use on my page).

为什么不将所有文件都放在静态文件夹中，仅此而已?
robots.txt 和 robots.png 有什么区别?
关于这些目录的最佳做法是什么?

Why not put all of the files in the static folder and that's it?
What is the difference between robots.txt to robots.png?
What are the best practices regarding these directories?

谢谢

推荐答案

assets 文件夹的内容将被 webpack 处理，如果你使用 CSS 预处理器，如 SASS、SCSS 或 Stylus它将转换为通用 CSS.或者你在那个文件夹里放了一张图片，它也会被 webpack 优化用于生产.

The content of assets folder will be process by webpack, if you use pre-processor for CSS like SASS, SCSS, or Stylus it will transform into generic CSS. Or maybe you put an image on that folder, it also will be optimized by webpack for production.

对于 static 文件夹，它只是一个可以放置所有静态资源的地方，例如用于背景或滑块的图像.它从未被 webpack 触及.

And for static folder, it just a place where you can put all of your static asset, like an image for background or slider. It never touched by webpack.

这篇关于NUXT-资产和静态文件夹-何时使用哪个?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！