как разработать React Provider в виде пакета NPM без всех зависимостей React "песочницы"?

Я надеюсь извлечь код для входа в систему для целей разработки из нескольких микроприложений в один пакет NPM в качестве <LoginProvider />. Сам провайдер - это не элемент пользовательского интерфейса, а просто способ отслеживать процесс, в котором мы делаем /GET из Auth0, а затем сделайте /GETв наш бэкэнд для загрузки пользовательских данных. Я использую Rollup для преобразования с Typescript на ES5.

Раньше я не создавал пакет NPM, поэтому я немного не уверен в лучших практиках. Я думаю, что хочу иметь локальную песочницу, которая имеет состояние "до" авторизовано и "после", чтобы я мог доказать, что этот провайдер работает с элементами пользовательского интерфейса. Или это плохая идея? Если это плохая идея, вот что npm linkдля? Одна вещь, которую я не понимаю, - это как создать этого поставщика, не подвергая воздействию таких приложений, как webpack / babel или create-response-app в package.json, которые на самом деле не требуются для использования поставщика. Все учебники предназначены для создания компонентов пользовательского интерфейса, чего я не делаю, потому что я не хочу раскрывать "песочницу" элементов пользовательского интерфейса.

мой package.json в настоящее время выглядит так:

{
  "name": "loginas",
  "version": "0.0.0",
  "description": "LoginAs provider for development",
  "main": "index.tsx",
  "module": "build/bundle.loginas.js",
  "scripts": {
    "build": "rm -rf build && rollup -c",
    "lint": "eslint",
    "lint:fix": "eslint './src/**/*.{ts,tsx}' --fix",
    "prettier": "prettier",
    "prettier:write": "npm run prettier",
    "test": "test",
    "start": "rollup -c -w"
  },
  "repository": {
    "type": "git",
    "url": "utils"
  },
  "author": "Me",
  "license": "ISC",
  "peerDependencies": {
    "react": "^16.8.0",
    "react-dom": "^16.8.0"
  },
  "devDependencies": {
    "@rollup/plugin-node-resolve": "^9.0.0",
    "@types/react": "^16.9.49",
    "@types/react-dom": "^16.9.8",
    "@typescript-eslint/eslint-plugin": "^4.1.1",
    "@typescript-eslint/parser": "^4.1.1",
    "babel-core": "^6.26.3",
    "babel-runtime": "^6.26.0",
    "eslint": "^7.9.0",
    "eslint-config-prettier": "^6.11.0",
    "eslint-config-standard-with-typescript": "^19.0.1",
    "eslint-plugin-import": "^2.22.0",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-prettier": "^3.1.4",
    "eslint-plugin-promise": "^4.2.1",
    "eslint-plugin-react": "^7.20.6",
    "eslint-plugin-react-hooks": "^4.1.2",
    "eslint-plugin-standard": "^4.0.1",
    "husky": "^4.3.0",
    "lint-staged": "^10.3.0",
    "prettier": "^2.1.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "rollup": "^2.26.11",
    "rollup-plugin-peer-deps-external": "^2.2.3",
    "rollup-plugin-typescript2": "^0.27.2",
    "typescript": "^4.0.2"
  }
}

На данный момент я не могу запускать код реакции... в браузере. Что было бы хорошим следующим шагом, чтобы сделать это, но без увеличения депрессии?

Должен ли я просто создать каталог "песочницы", у которого есть собственный package.json с create-react-app, например, но песочница исключена из Rollup?

0 ответов

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