Как я могу создать модуль npm, используя как реагировать, так и css модули? - PullRequest
0 голосов
/ 17 апреля 2019

Я пытаюсь создать библиотеку реагирующего пользовательского интерфейса на модуле npm.Он создан с использованием React и css-модулей.

Когда я импортирую его в другое приложение, модули не имеют каких-либо стилей, а также не имеют имени класса, поэтому я думаю, что стили css нарушены.

Прямо сейчас я использую веб-пакет для комплектации и бабел для переноса.Конечным результатом является минимизированная версия кода.Я попытался импортировать его без объединения веб-пакетов, но я получаю синтаксическую ошибку благодаря jsx.Я использую сборник рассказов для тестирования компонентов, и там все работает хорошо.

Все мои компоненты используют синтаксис:

...
import styles from "./ComponentName.css"

const Component = () => (
    <Something className={styles.something}>
    </Something>
)

export defaults Component;

Моя конфигурация веб-пакета почти стандартная, добавляется только CSSСекция модулей и babel-загрузчик:

...
{
    test: /\.css$/,
    use: [
      "style-loader",
      {
        loader: "css-loader",
        options: {
          importLoaders: 1,
          modules: true
        }
      },
      {
        loader: "postcss-loader",
        options: {
          plugins: loader => [
            require("postcss-nesting"),
            require("postcss-preset-env")({
              features: {
                "css-properties": true,
                "nesting-rules": true,
                "custom-media-queries": true,
                "media-queries-ranges": true
              }
            })
          ]
        }
      }
    ]
}
...
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...