如何解决Webpack图像找不到模块
我正在尝试通过以下方式导出图像:
const path = require('path');
module.exports = {
entry: './src/index.ts',module: {
rules: [
{
test: /\.ts?$/,use: 'ts-loader',exclude: /node_modules/,},{
test: /\.(png|svg|jpg|gif)$/,use: [
'file-loader',],resolve: {
extensions: [ '.tsx','.ts','.js' ],output: {
filename: 'bundle.js',path: path.resolve(__dirname,'dist'),};
这是我的文件夹结构:
这是我的index.ts
文件:
import {css} from 'lit-element';
import ErrorIcon from './assets/icons/error.svg';
export const iconStyles = css`
.icon-error {
background-image : src("${ErrorIcon.src}");
}
.icon-warning {
background-image : src("/assets/icons/warning.svg");
}`;
当我运行build时,出现以下错误:
TS2307:找不到模块“ ./assets/icons/error.svg”或其相应的类型声明。
我做错了什么?
解决方法
尝试一下:
background-image : url("${ErrorIcon.src}");
,
我在打字稿中找到了问题,您必须添加一个如下所示的文件:
declare module "*.svg" {
const content: any;
export default content;
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。