Vue新手常见问题

前言

有些问题,不知道是Vue的,还是NodeJs的,总之就归拢归拢都在这记录了。

动态加载静态资源

静态资源可以通过静态和动态两种方式加载。静态方式如下:

<img src="./image.png">

静态加载的资源在项目编译的时候,webpack会自动将其打包,只要原始路径正确,不存在加载失败的问题。
动态加载指在JavaScript或TypeScript等代码中,引入的静态资源地址,由于是字符串,所以,打包并不会识别这些资源将其打包到项目中,所以,需要进一步封装,可以通过require的方式将资源打包到项目中。

      imageIcons: [
        {
          value: 'src/assets/image-icon1.svg',
          content: '<img height="42px" src=' + require('../assets/image-icon1.svg') + '/>'
        }
      ]

通过代码加载静态资源的方式,称之为动态加载。

参考文章

从相对路径导入
Vue.js中引入图片路径的几种方式

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容