Конфигурация Webpack с реактивным классом, содержащим серверный код

У меня есть изоморфная реализация реакции/потока (альт).

Я пытаюсь преобразовать проект из браузера в веб-пакет.

Учитывая, что мой класс React может выглядеть так:

var dataAccess = require('../server/data-access');

var MyReactClass = React.createClass({

statics: {
    /**
     * This gets called by the containing component, so that each class
     * handles its own data fetching.
     * This part is obviously irrelevant in the client since the 
     * fetching is only done server-side and the result is used
     * to populate the Alt.js store
     */
    getData: function () {

        return dataAccess.fetchData(
        );

    }
}...

Я хотел бы избежать связывания всей папки «сервер» при запуске веб-пакета, но когда я это делаю (через исключение в конфигурации загрузчика), все происходит странным образом:

 ERROR in ./react/react-routes.js
Module parse failed: C:\project\react\react-routes.js Line 19: Unexpected token <
You may need an appropriate loader to handle this file type.
| var routes = (
|
|     <Route name="App" path="/" handler={App}>
|
|         <DefaultRoute name="Default Route" handler={Main}/>
 @ ./client/index.js 5:18-50

Если я верну «сервер» обратно, я получаю ошибки при преобразовании зависимостей mongojs («net» и т. д.), что я не считаю правильным направлением.

Если я удалю все требования к своим классам реагирования в react-routes.js, веб-пакет сможет успешно завершиться. Из этого я понимаю, что проблема действительно в том, что в моих классах есть серверный код.

В браузере мне удалось преодолеть это, используя требование для «доступа к данным» и других файлов сервера внутри функции getData(), но с веб-пакетом мне пока не повезло.

Какими должны быть мои правила игнорирования/исключения и как их реализовать?

Спасибо.


person Shahar    schedule 12.09.2015    source источник


Ответы (2)


Что, если бы вы решили это вне Webpack? Вы можете выполнить npm i babel --save-dev, а затем запустить require('babel/register') перед импортом этого бита dataAccess. Тогда он сможет работать с JSX. Это было бы самым простым решением для меня.

person Juho Vepsäläinen    schedule 12.09.2015

React with Flux вот мой репозиторий на github, надеюсь, он поможет понять основы взаимодействия с Flux https://github.com/TameshwarNirmalkar/ES6Babel он имеет:

  • Вебпак
  • ES6
  • Вавилон
  • Эслинт
  • Реагировать
  • Флюс
  • Json-сервер для отдыха API
  • Завершить CRUD-операцию

Надеюсь, это будет полезно.

person Tameshwar    schedule 30.10.2016