(Или действительно любая другая система внешнего интерфейса)

Зачем тебе тоже !? В конце концов, Hyperapp - это крошечный фреймворк, состоящий из представления и единого дерева, с упором на KISS. Это своего рода React + Redux Lite. Между тем, Create React App (CRA) - это большая полнофункциональная конфигурация цепочки инструментов, использующая надежные, лучшие в своем классе инструменты и обеспечивающая отличный опыт разработчика и полностью готовые к производству сборки.

Что ж, дело в том, что да, вы можете очень легко создать классные маленькие тестовые приложения с помощью Hyperapp, даже прямо в одном файле HTML без инструментов для сборки. Однако, если вы хотите опубликовать что-то для конечных пользователей, вам необходимо качество продукции. Именно здесь на помощь приходит приложение Create React.

Но вы говорите: «Разве в названии нет подсказки, а CRA - только для реакции?» Хорошее предположение, но оказывается, что почти все инструменты и настройки довольно общие и подходят для многих веб-приложений SPA. Даже некоторые инструменты, в названии которых есть «React», не являются полностью React-специфичными. Плюс JSX определенно используется вне приложений React, в том числе очень хорошо работает с Hyperapp.

На самом деле, вы можете легко создавать приложения Hyperapp с помощью CRA. Вам нужно изменить пару параметров конфигурации, чтобы избежать ошибок при использовании JSX, но это может быть все. Если вы не используете JSX, возможно, вам не потребуется ничего делать, чтобы получить надежную разработку и сборки для Hyperapp.

Другие настройки, специфичные для React, тоже не являются проблемой. Вероятно, потому что они не срабатывают. Но если вы столкнетесь с другими проблемами, Конфиги CRA находятся на GitHub. Если вы обнаружите дополнительные проблемы, оставьте комментарий, чтобы я мог обновить этот пост.

Итак, вот минимальные шаги по настройке CRA для использования JSX с Hyperapp ..

  • `Извлеките` ваш проект CRA, чтобы файлы конфигурации стали доступными в вашем проекте (вам может не понадобиться это делать, см. Ниже)
  • Измените свой `package.json`, чтобы изменить конфигурации` babel` и `eslint` следующим образом:
  "babel": {
    "plugins": [
      ["transform-react-jsx", { "pragma": "h" }]],
    "presets": [
      "react-app"
    ]
  },
  "eslintConfig": {
    "extends": ["react-app"],
    "rules": {
      "react/react-in-jsx-scope": "off",
      "no-unused-vars": ["warn", {"args": "none",
                                  "ignoreRestSiblings": true,
                                  "varsIgnorePattern": "^h$"}]
    }
  }

Настройка babel позволяет JSX использовать функцию Hyperapp `h ()` вместо стандартной `React.CreateElement ()`.

Между тем, настройки eslint отключают ошибки, вызванные тем, что React не объявляется, а h объявляется для JSX, но не используется в исходном коде.

Я не хочу катапультироваться

Это вполне понятно, поскольку вы фактически взяли на себя конфигурацию и не сможете использовать обновления CRA без объединения изменений.

[Обновление: 29.01.18) Один очень хороший подход от Вольфганга из команды Hyperapp - https://github.com/okwolf/cra-hyperapp. При этом используется сценарий для изменения и делегирования сценариям CRA.

Альтернативой является форк сценариев CRA и поддержка их в качестве «вкуса» для других, а также для себя. Возможно, команда Hyperapp сделает это, если проявит достаточно интереса.

Машинопись?

Конечно. Вы можете использовать разветвленный скрипт CRA create-response-script-ts. Здесь используются tsc и tslint, а не babel и eslint.

К счастью, tsc позволяет вам изменять функцию JSX. Используйте настройки jsx: react (фу) и jsxFactory: h. Я не проверял, нужно ли изменять настройки tslint.

Альтернативы

В Awesome Hyperapp есть несколько шаблонов, но, честно говоря, хорошо поддерживаемое решение, такое как CRA, обеспечивает гораздо лучший опыт обслуживания. ИМХО.