Сделайте так, чтобы модули, импортированные из webpack (raw-loader), работали с quokka. Не удается найти ошибку модуля

Я хотел бы использовать quokka в проекте, где я использую raw-loader для загрузки обычного текста из других скриптов в машинописный текст. Моя проблема в том, что я не могу заставить quokka загружать модули, в которых raw-loader делает, как указано в конфигурации веб-пакета.

В моем файле webpack.config, среди прочего, есть:

const srcPath = path.resolve(__dirname, 'src');
module.exports = {
    resolve: {
        alias: {
          '@': srcPath,
        },
        extensions: ['.tsx', '.ts', '.js', '.js', '.json'],
      },

    {
        test: /\.(vert|frag)$/,
        loader: 'raw-loader',
        include: srcPath,
        exclude: modulesPath,
    },
}

Чтобы иметь возможность использовать определенный импорт в моем проекте, например:

import vertexShaderSource from '@/shaders/main.vert';

Thant отлично работает. Но когда я пытаюсь включить quokka в свой проект и пытаюсь использовать псевдоним @ в config.json quokka:

{
    "pro":true,
    "plugins":[
        "alias-quokka-plugin",
        "jsdom-quokka-plugin"
    ], 
    "alias": {
        "@/": "./src/"
    }
}

Я получаю сообщение об ошибке: не могу найти модуль '@/shaders/main.vert'. Я старался:

1.- Все комбинации путей в псевдониме, чтобы избежать ошибок типа, а также пытался жестко закодировать путь непосредственно в config.json, но кажется, что raw-loader должен вступить в игру, и он не знает, как сделать логику из webpack.config работает в config.json quokka.

2.- Жесткое кодирование пути в импорте напрямую:

import vertexShaderSource from 'fullPathHere';

Но eslint не распознает это как модуль, согласно настройкам импорта eslint в.eslintrc.js:

settings: {
    'import/resolver': {
      alias: {
        map: [
          ['@', path.resolve(__dirname, 'src')],
        ],
      },
      node: {
        extensions: ['.js', '.jsx', '.ts', '.tsx', '.json'],
      },
    },
    'import/parsers': {
      '@typescript-eslint/parser': ['.ts', '.tsx'],
    },
  },

Подводя итог, вопрос в том, как заставить модули, импортированные из raw-loader, работать с quokka.

Изменить: в документации объясняется, как сделать импорт квокка в соответствии с конфигурацией веб-пакета, поэтому я добавил appconfig в свой файл конфигурации веб-пакета:

// in webpack.config.dev
resolve: {
   alias: {
      appconfig: 'path/to/appconfig/dev'
   }
}

Более конкретно, в моем webpack.config.js:

resolve: {
    alias: {
      '@': srcPath,
    },
    extensions: ['.tsx', '.ts', '.js', '.js', '.json'],
    appconfig: 'fullHardcodedPathToMywebpack.config.jsFile',
  },

Как указано в документации, но я продолжаю получать ошибку "модуль не найден".

0 ответов

Другие вопросы по тегам