无法在vue-cli项目中加载带有自定义加载器的模块

Question

我有一个项目，其中网页4.43。已使用vue cli设置了0。我正在尝试使用图像大小加载程序在构建时获取图像大小。

为了这个，在我的一本书里。我尝试使用在项目中安装的自定义加载程序加载模块的vue文件：

const background = require("image-size!../../../../assets/images/candy.jpg");

当我的项目构建时，它输出以下错误：

 ERROR  Failed to compile with 1 errors8:47:03 AM

This dependency was not found:

* image-size!../../../../assets/images/candy.jpg in ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./src/vue/guides/tags/hero/TagGroupInvite.vue?vue&type=script&lang=js&

To install it, you can run: npm install --save image-size!../../../../assets/images/candy.jpg

文件存在，js/ts/css文件解析良好。我的设置有什么问题？

Answer 1

我认为您也必须指定图像大小作为加载程序。

将此加载程序追加到webpack.base.conf.js

...
loaders: [
    ...
    {
        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
        loader: 'image-size'
    }
    ...
]
...