如何在 netlify 上为 ReactJS 组件库部署演示应用程序？

Question

我正在构建一个 ReactJS 库组件：

GitHub 回购：https://github.com/appukuttan-shailesh/neo-viewer/tree/react_lib
分支机构：react_lib

使用此组件的演示应用程序位于演示目录中（位置：js/react/demo）。我尝试部署的应用是这个演示应用。

我的 package.json 组件 (js/react) 的“脚本”设置为：

"scripts": {
    "build": "rollup -c",
    "build-watch": "rollup -c -w",
    "start-demo": "cd demo && npm run start",
    "i-all": "npm i && cd demo && npm i",
    "dev": "npm-run-all --parallel build-watch start-demo"
  }

在本地，我运行我的应用程序通过执行以下操作： npm run dev

但是当我部署到 netlify 时，这不起作用。我也尝试了其他构建命令，例如：
rollup -c
rollup -c && cd demo && npm run start
npm-run-all --parallel build-watch start-demo

我过去曾设法在 netlify 上部署其他应用程序（但它们都是由 yarn build 构建的更简单的应用程序），但这个具有不同的结构，我不知道如何继续。

我想我需要以不同方式处理此部署，因为它使用汇总？从 Netlify 支持，我的理解是：

you can’t run a server on Netlify.

和

what you need is a command to build a production version - something that will output the required files and the command would exit. After this happens, Netlify will deploy your website.

我想我需要为演示应用程序生成一个 'dist' 或 'build' 目录，然后可以将其部署在 netify 上。我该怎么做？

Answer 1

在 netlify 团队 (see here) 的帮助下终于解决了这个问题！

总结

最佳建议：

To debug I’d suggest starting again from a fresh clone of your own repo and paying attention to the steps you need to perform to get it working locally. You’ll need to ensure that the instructions you provide Netlify perform those same steps.

这在本地对我有用

git clone --single-branch --branch react_lib https://github.com/appukuttan-shailesh/neo-viewer

cd neo-viewer/js/react

npm update && npm run build-lib && npm run i-all && npm run build-demo

serve-s demo/build

仅供参考，我在基础“package.json”中的“脚本”设置如下：

"scripts": {
    "build-lib": "rollup -c",
    "build-lib-watch": "rollup -c -w",
    "build-demo": "npm run build-lib && cd demo && react-scripts build",
    "start-demo": "cd demo && npm run start",
    "i-all": "npm i && cd demo && npm i",
    "dev": "npm-run-all --parallel build-lib-watch start-demo"
  }

所以现在我将 netlify 上的“构建”命令设置为：

npm update && npm run build-lib && npm run i-all && npm run build-demo

一切正常！ :-)

如何在 netlify 上为 ReactJS 组件库部署演示应用程序？

How to deploy a demo app for a ReactJS component library on netlify?

web-deployment

reactjs

netlify

总结