关于npm警告fsevents和vue-cli项目中的一些问题,持续更新
1.install一个npm包的时候,总是会报这个警告;
网上查资料知道,这个fsevents是mac下用的,windows忽略即可;
2.关于在main.js中引入less文件的问题,
就会报这个错,说相关模块没有找到,这个问题,我在网上找了很多资料,然后我也都试了,都不好用,于是我的解决办法就是不在main.js中引入less(我投降了还不行么,2333),
另外,如果有知道如何解决的大牛,可以在下边评论区告诉我哦,谢谢啦~
3.首先目录结构如下:
然后,在header.vue文件中,想引入mixin.less文件,mixin.less文件内容如下:
引入less文件之后,在header.vue文件中使用.bg-img(brand);就会报错:
原因就是路径有问题,在报错中,不难发现这个路径是相对于mixin.less文件的路径,在这个路径中没有找到指定的图片资源,当然会报错了,而我想做的就是让mixin.less中写的背景图片路径是相对于我这个header.vue文件来的,然后在 网上找到解决办法就是修改mixin.less中的代码为:
在url前加上~这个符号,就会发现问题解决了;
4.在vue中异步请求的数据没回来的话,使用v-for循环的话会报错,而且看到的效果是页面渲染的结果和自己预期的一致:
html:
报错信息:
原因很简单,就是请求的数据没回来,然后在渲染DOM的时候,找不到seller.supports[index].description 对应的数据,所以会报错,
解决办法就是加个v-if判断一下请求的数据回没回来,然后再渲染DOM;
加v-if的时候,又出现了一个问题:v-if和v-for同时使用会冲突么? 上面的两种我都试了,页面的效果肉眼看是没影响的,
但是上网查资料说:当v-if 与 v-for 一起使用时,v-for 具有比 v-if 更高的优先级,所以我为了保险起见,还是用的第二种~;
5.backdrop: blur(10px); //ios下背景模糊,移动端可看效果,pc浏览器看不见;
6.关于1px border问题,如果直接给元素设置border-bottom:1px solid #fff;这样在pc端看着像是1px,但是在实际手机上看就不是1px,而是2px,那么解决办法就是对目标元素添加after伪元素,然后给伪元素设置border,然后对目标元素下的伪元素进行CSS3的缩放Y轴: transform: scaleY( 缩放比例 );
7. el.offsetHeight // 触发浏览器重绘
8.页面顶部大头图加载的问题:因为图片大小不规则,而且在给img添加vue的:src属性时,浏览器最初渲染DOM时候,img高度是0,当vue读取并对:src属性值进行替换加载图片的时候就会出现卡顿,解决办法就是给img的父级设置:宽100%,上padding或者下padding为100%(相对于宽度大小),然后子元素img相对父级进行定位,并设置宽高100%;
9. 利用localStorage存储收藏商家的状态
读取状态:
10.项目最后打包:执行 npm run build 命令 (自动执行build.js文件中的代码),打包过程中会将js文件和css文件提取出来,分别存到对应的文件夹下,文件名是哈希值,内容改变哈希值改变,然后需要 在根目录下创建server.js文件来启动项目(index.html),如果不想让项目可以调试,可以将sourceMap改为false;
关于npm警告fsevents和vue-cli项目中的一些问题,持续更新的更多相关文章
- Vue.js2.0中的变化(持续更新中)
最近自己在学习Vue.js,在看一些课程的时候可能Vue更新太块了导致课程所讲知识和现在Vue的版本不符,从而报错,我会在以后的帖子持续更新Vue的变化与更新,大家也可以一起交流,共同监督学习! 1. ...
- vue.cli项目中src目录每个文件夹和文件的用法
assets文件夹是放静态资源:components是放组件:router是定义路由相关的配置:view视图:app.vue是一个应用主组件:main.js是入口文件:
- Vuex内容解析和vue cli项目中使用状态管理模式Vuex
中文文档:vuex官方中文网站 一.vuex里面都有些什么内容? const store = new Vuex.Store({ state: { name: 'weish', age: }, gett ...
- vue cli 项目中设置背景图
https://blog.csdn.net/MoLvSHan/article/details/78204972 不能直接写成相对路径,像下面这这种就会报错 backgroundImage: " ...
- 改造@vue/cli项目为服务端渲染-ServerSideRender
VUE SEO方案二 - SSR服务端渲染 在上一章中,我们分享了预渲染的方案来解决SEO问题,个人还是很中意此方案的,既简单又能解决大部分问题.但是也有着一定的缺陷,所以我们继续来看下一个方案--服 ...
- Vue+Typescript项目中使用echarts
方案一:推荐 在typescript+Vue的项目中引用echarts,为了加强引用,引入echarts和@types/echarts两个包,一个是工程依赖,一个是声明依赖. npm install ...
- 在基于ABP框架的前端项目Vue&Element项目中采用电子签名的处理
在前面随笔介绍了<在基于ABP框架的前端项目Vue&Element项目中采用电子签章处理文件和打印处理>的处理,有的时候,我们在流程中或者一些文件签署的时候,需要签上自己的大名,一 ...
- npm包管理工具在一般项目中的应用方法
最近自己在有时间,在通学一些知识点,记录一下,以便以后使用方面 当我们在做项目的时候,如果需要到包管理工具,那么我们一定会经历以下流程: 1.首先在官网下载node.js,然后默认安装到C盘 检查是否 ...
- 在基于ABP框架的前端项目Vue&Element项目中采用电子签章处理文件和打印处理
在一些内部OA或者流转的文件,或者给一些客户的报价文件.合同,或者一些医院出示的给保险机构的病历资料等,有时候可能都希望快速的使用电子签章的处理方式来给文件盖上特定的印章,本篇随笔介绍基于Vue&am ...
- Vue 实际项目中你可能会遇见的坑
纸上得来终觉浅,绝知此事要躬行! Vue的文档和教程看的太多,小的demo做的多,也不如自己实际的进行一个完整项目的开发.只有做了才知道原来问题这么多,这里列举了一些你做demo教程可能不会遇见的坑. ...
随机推荐
- 【JavaScript框架封装】实现一个类似于JQuery的基础框架、事件框架、CSS框架、属性框架、内容框架、动画框架整体架构的搭建
/* * @Author: 我爱科技论坛 * @Time: 20180715 * @Desc: 实现一个类似于JQuery功能的框架 * V 1.0: 实现了基础框架.事件框架.CSS框架.属性框架. ...
- jquery bind 传参数
方法一. ? 1 2 3 4 function GetCode(event) { alert(event.data.foo); } ? 1 2 3 4 $(document).ready(functi ...
- luogu P4756 Added Sequence(凸包+思维)
一眼望去不会. 考虑问题中的\(f(i,j)=|\sum_{p=i}^{j}a_p |\)的实际意义. 其实就是前缀和相减的绝对值. \(f(i,j)=|\ sum[j]-sum[i-1]\ |\ ...
- nyoj303-序号交换
序号互换 时间限制:1000 ms | 内存限制:65535 KB 难度:2 描述 Dr.Kong设计了一个聪明的机器人卡多,卡多会对电子表格中的单元格坐标快速计算出来.单元格的行坐标是由数字编号 ...
- [网络流24题] 太空飞行计划问题 (最大流->最大权闭合图)
洛谷传送门 LOJ传送门 做这道题之前建议先看这篇论文,虽然论文里很多地方用了很多术语,但hbt神犇讲得很明白 这篇题解更加偏向于感性理解 把问题放到二分图上,左侧一列点是实验,权值为$p[i]$,右 ...
- freeswich 安装mod_av
转载 https://www.cnblogs.com/zgen1/p/7867303.html 需要先编译libav库 编译libav下载:git clone https://freeswitch ...
- phpEXCEL如何设置单元格格式为百分比
$objExcel->getActiveSheet()->getStyle('C9')->getNumberFormat()->setFormatCode(PHPExcel_S ...
- Java 接口技术 Interface
一.什么是接口技术(Interface): //举例中Comparable是一个接口,Employee是一个类 1.接口不是类,而是对类的一组描述,并不给出每个类的具体实现. 2.一个类可以实现多个接 ...
- 《生活在Linux中》之:在Bash的Emacs模式中使用Vim
export EDITOR=vim ctrl-x ctrl-e
- 程序猿的量化交易之路(18)--Cointrader之Event实体(6)
转载需注明: 事件,是Esper的重要概念. 这里我们定义个事件类.它是Temporal实体的派生类. 不过对Temporal简单的包装.其代码例如以下: package org.cryptocoin ...