使Webpack导入的模块原始加载程序与quokka一起使用找不到模块错误

如何解决使Webpack导入的模块原始加载程序与quokka一起使用找不到模块错误

我想在一个项目中使用quokka，在该项目中，我使用raw-loader来加载打字稿中其他脚本的原始文本。我的问题是，我无法按照webpack配置中指定的原始加载器加载模块进行加载。

在我的webpack.config中，除了其他设置外，我还有：

const srcPath = path.resolve(__dirname,'src');
module.exports = {
    resolve: {
        alias: {
          '@': srcPath,},extensions: ['.tsx','.ts','.js','.json'],{
        test: /\.(vert|frag)$/,loader: 'raw-loader',include: srcPath,exclude: modulesPath,}

为了能够在我的项目中使用特定的导入，例如：

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

Thant工作正常。但是，当我尝试将quokka合并到我的项目中，并尝试在quokka的config.json中使用@别名时：

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

我收到错误：找不到模块'@ / shaders / main.vert'。 我尝试过：

1.-别名中的所有路径组合都避免了类型错误，并且还尝试直接在config.json中对路径进行硬编码，但是似乎原始加载程序必须发挥作用，并且不知道如何制作来自webpack.config的逻辑可以在quokka的config.json中使用。

2.-直接在导入中对路径进行硬编码：

import vertexShaderSource from 'fullPathHere';

但是，根据.eslintrc.js中的eslint导入设置，eslint无法将其识别为模块：

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

总而言之，问题是如何使原始加载程序导入的模块与quokka一起使用。

编辑：在documentation中说明了如何根据webpack配置进行quokka导入，因此我将appconfig添加到了webpack配置文件中：

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

更具体地说，在我的webpack.config.js中：

resolve: {
    alias: {
      '@': srcPath,appconfig: 'fullHardcodedPathToMywebpack.config.jsFile',

如文档中所述，但我不断收到模块未找到错误。