项目中图片等一些静态资源存放在public与存放在assets中的区别

最新推荐文章于 2024-04-30 15:14:57 发布
最新推荐文章于 2024-04-30 15:14:57 发布
阅读量516 收藏 1
点赞数
文章标签： webpack 前端 node.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_58149434/article/details/129875088
版权
文章讲述了在项目中，public目录下的静态资源如图片，不经过Webpack处理，使用绝对路径引用，编译后可以替换。而assets目录中的静态资源则会通过Webpack，用相对路径引用，编译后不能替换，强调了两者在项目构建中的不同处理方式和使用场景。
摘要由CSDN通过智能技术生成

public:存放在public下的图片等静态资源，不用经过webpack，通过绝对路径来引用，系统编译后，可替换；

assets：存放在assets下的图片等一些静态资源，经过webpack，通过相对路径来引用，系统编译后，不可替换。

野区小女王
关注
解决vue打包之后静态资源图片失效的问题
08-28
在 Vue 项目中， 经常会遇到一个问题，即在打包之后静态资源图片失效的问题。这种问题可能会导致图片无法显示，控制台中提示某个图片没有找到（404 错误）。这种问题的出现主要是由于图片的引入路径和静态资源文件的...
Vue项目中图片资源应该存放public还是assets文件夹下？
Sun_blog
08-22 379
携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第23天，点击查看活动详情 前言 你是否有过这样的疑问？ 在vue项目中public和assets文件夹都可以存放图片，那么图片应该存放public还是assets文件夹下？ public或assets文件夹下有什么区别呢？ 什么样的图片应该存放在public文件夹下？ 什么样的图片应该存放在assets文件夹下？ ...
Vue—public文件夹与src/assets文件夹的区别
雷雨天的雷胖子
12-24 5351
目录 一、概述 二、详解 三、拓展 一、概述 vue-cli3.0创建的项目中，有两个静态资源目录，分别是public和assets。其中public相当于一个静态资源服务器，assets则存放项目的依赖资源。 二、详解 public文件夹 存放静态资源，且该目录下的资源不会被webpack解析处理，如下图所示，打包时将被直接复制到dist目录，注意，public目录下的空文件夹不会被复制到dist目录。所以，如果引用的资源不希望被webpack处理时，可将其放置在public目录下。p
前端学习 vue中public与assets的区别
m0_45986724的博客
08-04 5357
一.public和assets文件的异同 1.相同点 文件夹中的资源在html中使用都是可以的。 2.不同点 使用assets下面的资源，在js中使用的话，路径要经过webpack中的file-loader编译，路径不能直接写。 使用public文件下面的资源，是不会被webpack处理的，它们会被直接复制到最终的打包目录下面，且必须使用绝对路径来引用这些文件。 1.public中的文件，是不会经过编译的，打包后会生成dist文件夹，public中的文件只是复制一遍。因此，public建议放一些外部第三方，
public和assets⽂件的异同
超级罗伯特的博客
05-12 530
public中的⽂件，是不会经过编译的，打包后会⽣成dist⽂件夹，public中的⽂件只是复制⼀遍。因此，public建议放⼀些外部第三⽅，⾃⼰的⽂件放在assets，别⼈的放public中
vue框架中，图片应该保存在哪里？应该如何访问？
热门推荐
商务合作 | 共同学习 | 携手共进
10-08 5万+
在使用vue框架进行开发的过程中，有两个文件夹都可以存放我们的图片以及样式等等，一个是public文件夹，一个是src下的assets文件夹；接下来博主会从这两个文件夹对图片的不同处理来进行分析： public 如果将图片存入public文件夹，系统就会将原来的图片路径及名称编译为一个随机的名字，如下： 经过编译后的图片会极大的减小所占内存，所以在网页中直接展示的图片或者经常随数据库变换而变换的图片都应该放在public文件夹下，这样也可以加快网...
public和assets下放图片的区别，图片路径的引用方法
weixin_52388167的博客
04-22 2527
public和assets下放图片的区别： 相同点：都是存放静态资源 不同点： public：图片不会被webpack打包编译，直接复制到最终的打包目录下面 assets：在js中使用的话，路径要经过webpack中的file-loader编译 注意： 若把图片放在assets和public中，html页面都可以使用，但是在动态绑定中，assets路径的图片会加载失败（因为webpack使用的是commonJS规范，必须使用require才可以。 引用assets中的图片： 1、<img src="
vue 图片资源应该如何存放并引入（public、assets）？
Start2019
02-18 3万+
两者存放什么图片，什么时候使用，在某种情况下应该使用哪种方式； 使用方式； 图片路径转换；
vue cli3.0打包上线静态资源找不到路径的解决操作
10-15
在使用 Vue CLI 3.0 进行项目打包时，可能会遇到静态资源（如图片、CSS、JavaScript 文件等）找不到路径的问题。这个问题通常出现在部署到服务器后，因为本地开发环境与线上环境的资源路径不同。以下是如何解决这个...
在pycharm中开发vue的方法步骤
最新发布
05-19
- **assets**：存放静态资源如图片、字体等。 - **components**：存放可复用的小型组件。 - **views**：存放页面级别的组件。 - **App.vue**：主组件，通常包含整个应用的布局结构。 - **main.js**：项目入口...
Vue中public和assets的异同
balloonhunter的博客
06-22 1677
相同点 两个目录都可以用来放置静态资源。 不同点 public目录用来放不会变动的文件。public下的文件不经过webpack处理，打包后会被直接复制到dist文件夹。（需要使用绝对路径来引用这些文件） assets目录用来放可能会变动的文件。assets下的文件会被webpack解析为模块依赖。（需要使用相对路径来引用对应文件） 建议 将一些外部第三方的文件放在public中，自己的文件放在assets中。 图片引用时，放在public和assets都可以，需要注意的是：在动态绑定中，assets路径
Vue中public/assets目录区别
m0_69497411的博客
04-30 2920
一直以来都有个疑问在vue的项目中有两个静态资源目录文件夹public和assets，在实际项目里如果有资源到底是放在哪个里面?两者有什么区别？
项目实战-爬坑系列vue-cli3.x中public和assets的区别（七）
月落星河
04-28 1万+
接上篇文章讲问什么必须放在静态资源文件中，具体可以转到webpack 模板的文档 - Handing Static Assets 咱们先抛出问题： 我在根目录新建了文件里面是有数据的，我打开浏览器输http://localhost:8080/hello.json是请求不到的，它会自动给你返回到首页 但是如果我们在去获取静态目录下的json文件就可以： 已经获取到了这个json数据： v...
vue中assete和public目录的区别
Mjxiaomihu的博客
08-09 1590
vue中assete和public目录的区别
vue-cil中public（旧版本为static）和assets文件夹的区别
aitoao6的博客
04-08 2628
使用npm run build命令时，public中的文件会被直接复制到dist文件夹下，使用public文件夹中的资源时应该使用绝对路径，采用BASE_URL+文件名写法 <img :src="`${publicPath}1.jpg`" alt="public中的图片找不到啦"> data:function(){ return { publicPath:process.env.BASE_URL } } 而assets文件夹中的资源会经过webpa
Vue中public 与 assets 目录的区别@expansion---low_level
weixin_45549481的博客
10-18 1384
public 与 assets 目录的区别 public public放不会变动的文件 npublic/ 目录下的文件并不会被Webpack处理：它们会直接被复制到最终的打包目录（默认是dist/static）下。必须使用绝对路径引用这些文件， 这个取决于你vue.config.js中publicPath的配置，默认的是/。 任何放置在 public 文件夹的静态资源都会被简单的复制，而不经...
PHP静态资源二级目录,在thinkphp5.0项目中,可以将静态资源文件放到public目录下, 也可以放在public目...
weixin_30113867的博客
04-02 463
利用下列过量的哪种试剂,可将锌离子和铝离子分离?我国水泥产品质量水平划分为三个等级,正确的是:(1.0分)企业为开发新技术新产品新工艺发生的研究开发费用,未形成无形资产计入当期损益的,再按照规定在税前据实扣除的基础上,按照研究开发费用的多少加计扣除桃在植物学上隶属于:Molar solubility (mol/L) is the number of moles of solute dissolve...
vue散记：vue-cli3中public目录和assets目录的区别
tianjiliuhen的博客
05-27 7568
vue散记：vue-cli3中public目录和assets目录的区别前言vue-cli3工程中public和assets的区别1.vue build 打包2.assets 和 public 的区别2.1 public目录2.2 assets目录 前言   之前使用过别人写的vue+element项目，在别人搭建好的框架下修修改改、缝缝补补，感觉还行，整体流程还能走的通，但是不能总是用别人搭建好的框架啊。于是就想着自己也用vue-cli搭建一套，搭建的过程中也遇到了些问题，有些不理解的，就记下来，因为比较散
vue - 图片存放路径`public目录、src/assets目录下）的区别、访问方式
欢迎来到猫猫的博客 o_o ，如有问题，欢迎提出改正~
12-06 8525
public目录下项目需要使用的静态资源，有更新动态显示的需求。 src/assets目录下适合存放项目中所必须的图标，属于代码的一部 图片存放在这两个位置时的访问方法： public目录下：使用 / 开头的绝对路径访问 若：/public/images/a.jpg 访问： <img src="/images/a.jpg"> 若：/public/images/a/b/c/d.jpg 访问： <img src="/..
vue-cli 中 assets public的区别
03-22
在Vue CLI中，assets目录用于存放需要经过webpack打包处理的静态资源，例如图片、字体等。而public目录则是用于存放不需要经过webpack打包处理的静态资源，例如favicon.ico、robots.txt等。因此，assets目录中的文件...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值