Блог

Я пытаюсь экспортировать свои изображения, делая это:

 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");
  }`;
  

Когда я запускаю сборку, я получаю следующую ошибку:

TS2307: не удается найти модуль ‘./assets/icons/error.svg’ или соответствующие объявления типа.

Что я сделал не так?

я выяснил проблему, в настоящее время в typescript вам нужно добавить файл, который выглядит следующим образом:

 declare module "*.svg" {
  const content: any;
  export default content;
}
  

Источник

Попробуйте:

 background-image : url("${ErrorIcon.src}");