1、如果这些产品图片文件“万年不变”,放在 /static 目录里,(不需要使用require将这些图片作为模块来引用)

var products = [{
img: '/static/img/products/1.png',
name: 'Product 1'
}, {
img: '/static/img/products/2.png',
name: 'Product 2'
}, {
img: '/static/img/products/3.png',
name: 'Product 3'
}, {
img: '/static/img/products/4.png',
name: 'Product 4'
}]

2、Vue实例数据的数组中只会保存图片文件路径,通过webpack打包不会将图片拷贝到dist目录中,所以本着模块化的思想下,应该用require来引用

var products = [{
img: require('@/assets/products/1.png'),
name: 'Product 1'
}, {
img: require('@/assets/products/2.png'),
name: 'Product 2'
}, {
img: require('@/assets/products/3.png'),
name: 'Product 3'
}, {
img: require('@/assets/products/4.png'),
name: 'Product 4'
}]

vue中assets文件夹与static文件夹的区别的更多相关文章

  1. vue 项目中assets文件夹与static文件夹引用的区别

    首先,assets文件夹和static文件夹在vue-cli生成的项目中,都是用来存放静态资源的. 1.assets目录中的文件会被webpack处理解析为模块依赖,只支持相对路径形式.build的时 ...

  2. assets文件夹与static文件夹的区别

    assets文件夹与static文件夹的区别原地址==>https://www.cnblogs.com/x123811/p/9230700.html 相同点===>assets文件夹和st ...

  3. vue中assets和static的区别

    Vue中assets和static的区别 再一次框架定型中,与同事在静态资源的存放上有了一些分歧,后来经过查阅总结如下: 相同点:   assets和static两个都是存放静态资源文件.项目中所需要 ...

  4. vue 中 assets 和 static 的区别

    Vue中的静态资源管理(src下的assets和static文件夹的区别)

  5. vue中如何在本地导入js文件

    import {setStore,setUser,getStore,removeStore} from "../../../public/localstory" 在导入js文件时, ...

  6. Vue中删除重复上传的文件

    上传控件: <el-upload class="upload-demo"  :on-change="filesChange"> filesChang ...

  7. vue中基于sortablejs与el-upload实现文件上传后拖拽排序

    今天做冒烟测试的时候发现商品发布有一个拖拽图片排序功能没做,赶紧加上 之前别的同事基于 vuedraggable 实现过这个功能,我这里自己深度封装了 el-upload ,用这种方式改动很大,而且感 ...

  8. vue中import xxx from 和 import {xxx} from的区别

    1.import xxx from import FunName from ‘../xxx’ 对应js中的引用: export defualt function FunName() { return ...

  9. 在java中public void与public static void有什么区别 ?

    public void 修饰是非静态方法,该类方法属于对象,在对象初始化(new Object())后才能被调用:public static void 修饰是静态方法,属于类,使用类名.方法名直接调用 ...

随机推荐

  1. 【原】Github+Hexo+NextT搭建个人博客【1】

    该系列博客列表请访问:http://www.cnblogs.com/penglei-it/category/934299.html 摘要 GitHub 是一个开源项目的托管网站,相信很多人都听过.在上 ...

  2. Mysql基础命令(二)select查询操作

    条件查询 使用Where进行数据筛选结果为True的会出现在结果集里面 select 字段 from 表名 where 条件; # 例: select * from test_table where ...

  3. Salesforce Apex学习 : 利用Schema命名空间中的DescribeSObjectResult类型来获取sObject对象的基本信息

    DescribeSObjectResult 对象的取得: //使用getDescribe方法和sObject token Schema.DescribeSObjectResult mySObjDesc ...

  4. OD之绕过序列号验证(二)

    上次是修改程序的标题,大家应该感觉这只是一个起点而已,接下来我们可以尝试绕过序列号验证,这种技术应用在很多软件中,比如淘宝上要买什么的软件,商家都会发给`你一个用户名和密码,而且还有试用期什么的,这确 ...

  5. 自动化部署-Jenkins+SVN+MSBuild 一些补充

    1.ftp的使用 系统管理->插件管理 安装插件Publish Over FTP 系统管理->系统设置 配置ftp参数 如下图 进入任务配置,添加构建后操作 在使用过程中还遇到一个本地防火 ...

  6. 32bit 天堂2脚本修改资料大全【客户端+服务端】

    该资料夹中所有教程资料全部适合天堂2初章32位服务端的脚本修改,已经1.2章相关客户端的修改. https://pan.baidu.com/s/1RuGMFNgERd2JMYQpdceQwg 提取码: ...

  7. Leetcode(力扣) 整数反转

    Leetcode 7.整数反转 给出一个 32 位的有符号整数,你需要将这个整数中每位上的数字进行反转. 示例: 输入: -123 输出: -321 注意: 假设我们的环境只能存储得下 32 位的有符 ...

  8. EOS开发基础之四:使用cleos命令行客户端操作EOS——智能合约之eosio.bios和eosio.token

    现实世界中的合约,简单地说,是一个参与活动的所有人都需要遵循的协议.合约可以是正式的法律合同(例如,金融交易),或者是简单的游戏规则.典型的活动可以是诸如资金转移(在金融合约的情况下)或游戏动作(在游 ...

  9. Git多人协作工作流程

    前言 之前一直把Git当做个人版本控制的工具使用,现在由于工作需要,需要多人协作维护文档,所以去简单了解了下Git多人协作的工作流程,发现还真的很多讲解的,而且大神也已经讲解得很清楚了,这里就做一个简 ...

  10. 12.19daily_scrum

    本阶段已经过去一半,在周末短暂的休息后,我们将继续完成后续的任务,今日工作情况如下: 小组成员 今日任务 工作时间 李睿琦 网络数据传输应用设计 2 左少辉 主界面功能测试 3 程刚 界面优化学习 4 ...