猿问

vue-lazyload懒加载图片显示不出来

用vue-lazyload做懒加载,按照教程说的首先安装
npm install vue-lazyload --save-dev
这里我有个问题 ,就是这样安装之后,vue-lazyload出现在devDependencies而不是在dependencies里面,
按理说 devDependencies不是说 只是开发阶段使用 而不会在打包之后出现 但是按照我的理解 这个插件不是应该通过--save出现在dependencies里吗?

我的项目目录 是通过vuecli脚手架创建的
在main.js中

import VueLazyload from 'vue-lazyload'  //引入这个懒加载插件
 Vue.use(VueLazyload, {
  preLoad: 1.3,
  error: '../static/img/unload.jpg',
  loading: '../static/img/unload.jpg',
  attempt: 1})

在使用的index.vue中(index.vue位于src/page/index.vue):

通过v-for循环出来的:
  <img :v-lazy="single.pic_cover" alt="">  /* <img :src"single.pic_cover" alt="">*//直接绑定到src正常显示图片

实际渲染出来的结果 v-lazy似乎没有生效,如果生效的话 应该会渲染成src才对

<img v-lazy="../../static/img/m1.png" alt="">

//实在找不到问题出现在哪,球大神帮忙看看,先谢谢大家了


刚刚查找到问题 v-lazy居然不需要作为绑定属性,删除掉绑定的:即可
<img v-lazy="single.pic_cover" alt="">

那么现在还剩关于devDependencies 和dependencies,
为啥安装VueLazyload 不是通过--save安装到dependencies里面呢?~~
再次感谢大家


繁华开满天机
浏览 5293回答 2
2回答

喵喵时光机

npm install module --save会把module包安装到node_modules目录汇总会修改package.json,将模块名和版本号添加到dependencies部分之后运行npm install 命令时,会自动安装module包之后运行npm install --production或者注明NODE_ENV变量值为production时,会自动安装 module到node_modules目录中,即是在线上环境运行时会将包安装

慕容森

npm install module --save-dev会把module包安装到node_modules目录汇总会修改package.json,将模块名和版本号添加到devDependencies部分之后运行npm install 命令时,会自动安装module包之后运行npm install --production或者注明NODE_ENV变量值为production时,不会自动安装msbuild到node_modules目录中,即是在线上环境并不会进行安装。参考自(复制)
随时随地看视频慕课网APP

相关分类

Vue.js
我要回答