Как создать собственный загрузчик веб-пакетов, который все еще правильно компилирует мой реагирующий код?

Question

Я пытаюсь создать собственный загрузчик для использования в моем проекте NWB React. Я просто хотел бы создать собственный загрузчик, который ничего не делает, но поддерживает правильную компиляцию для моих реактивных компонентов. Кажется, я не могу заставить загрузчики работать в правильном порядке, а именно сначала должен произойти мой пользовательский загрузчик, а затем должен быть скомпилирован исходный код.

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

Вот мой nwb.config.js:

module.exports = function({command}) {

  /* Set config */
  let config = {
    type: 'react-app',
  }

  config.webpack = {
    entry: {
      App: './src/components/App.js',
    }
    extra: {
      output: {
        path: path.resolve('./dist/webpack_bundles/'),
      },
      module: {
        rules: [
          {
            test: /\.js$/,
            exclude: /node_modules/,
            loader: path.resolve('./my-loader.js'),
            enforce: 'pre',
            options: {text: 'hello world'},
          }
        ]
      },
    },
  }
  return config
}

А вот текст моего загрузчика, в основном заимствованный из примера на веб-пакете:

export default function(source) {
  // Do nothing
  return `export default ${ JSON.stringify(source) }`;
}

Наконец, вот источник, который я использую:

import React, {Component} from 'react'

export default class App extends Component {
  render() {
    return <div className="App">
      <p>Hello World</p>
    </div>
  }
}

Когда я удаляю раздел модуля из моей конфигурации webpack, стандартная конфигурация nwb webpack правильно скомпилировала мой реагирующий компонент. Однако, когда я вставляю свой загрузчик, он больше не компилирует его должным образом. Он просто возвращает код реакции без изменений. Я хотел бы, чтобы это скомпилировало код, возвращенный моим загрузчиком.

Answer 1

Мне просто нужно было вернуть исходный код без его строчки:

export default function(source) {
  // Do nothing
  return source;
}