Блог

В настоящее время я разрабатываю библиотеку компонентов с TSDX. На данный момент я борюсь с досадной проблемой с postcss. При сборке библиотеки операторы @import не генерируются поверх файла, содержащего все связанные библиотеки CSS, что приводит к появлению предупреждения в браузере (изображения ниже).

TSDX использует накопительный пакет под капотом. Вот моя конфигурация на данный момент:

 const postcss = require('rollup-plugin-postcss');
const autoprefixer = require('autoprefixer');
const cssnano = require('cssnano');
const atImport = require("postcss-import");

module.exports = {
  rollup(config, options) {
    config.plugins.push(
      postcss({
        plugins: [
          atImport(),
          autoprefixer(),
          cssnano({
            preset: 'default',
          }),
        ],
        inject: true,
        // only write out CSS for the first bundle (avoids pointless extra files):
        extract: !!options.writeMeta,
      })
    );
    return config;
  },
};
 

Я попытался использовать postcss-import для устранения проблемы, но это не сработало. Я очень неопытен в объединении JavaScript и CSS, поэтому я ценю помощь!

пример кода

предупреждение