Vue-lazyload lazy load picture cannot be displayed. - Codes Helper - Programming Question Answer

Vue-lazyload lazy load picture cannot be displayed.

do lazy loading with vue-lazyload, install
npm install vue-lazyload-- save-dev
first according to the tutorial. I have a problem here, that is, after installation, vue-lazyload appears in devDependencies rather than in dependencies.
devDependencies is not supposed to be used in the development phase and will not appear after packaging, but according to my understanding, this plug-in should not be used through-- save appears in dependencies?

my project directory is created through vuecli scaffolding
in 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
})

in the index.vue used (index.vue is located in src/page/index.vue):

v-for:
  <img :v-lazy="single.pic_cover" alt="">
  /* <img :src"single.pic_cover" alt="">*//src

the actual rendered result v-lazy does not seem to be valid. If it does, it should be rendered as src

.

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

/ / I really can"t find out where the problem is. Please take a look at it. Thank you first

. < hr >

just found that the problem v-lazy does not need to be used as a binding attribute. Delete the binding:

so what"s left about devDependencies and dependencies,
Why didn"t you install VueLazyload into dependencies through-- save? ~
Thank you again

Vue.js node.js webpack

Jun.11,2022

Hello, I have the same problem. How did you finally solve it?

npm install module-- save

will install the module package to the node_modules directory summary

modifies the package.json to add the module name and version number to the dependencies section

when you run the npm install command later, the module package is automatically installed

when you run npm install-- production or indicate that the value of the NODE_ENV variable is production, module is automatically installed into the node_modules directory, that is, the package is installed when the online environment is running

npm install module-- save-dev

will install the module package to the node_modules directory summary

modifies the package.json to add the module name and version number to the devDependencies section

when you run the npm install command later, the module package is automatically installed

when you run npm install-- production or indicate that the value of the NODE_ENV variable is production, msbuild is not automatically installed in the node_modules directory, that is, it is not installed in the online environment.
ider&for=pc" rel=" nofollow noreferrer "> refer to (copy)

Previous: How vue-cli axios.all makes requests execute sequentially

Next: Webpack installation less error

Vue node webpack, what on earth are these relationships?
A rookie at the front end is now developing a company project, using the development mode of the vue build tool, and then there are some problems when debugging the interface with the back end. The server software used by the company is apache,. Once a c...

Vue.js node.js webpack

Mar.03,2021

Menu