打包部署storybook

Question

老师，我的storybook打包后生成的静态文件夹，index.html直接进去是ok的，但是我把静态文件拉到我的服务器，并配置了域名，打开后包错了，这种一般是啥原因啊？
这是我部署的地址：https://leo-design.leosir.top/
这是报错信息：

Answer 1

张轩 2025-01-29 16:18:34

从错误信息来看，这是一个典型的静态资源加载问题。所有的 .js 文件请求都返回了 403 Forbidden 错误，这通常与以下一个原因有关：

服务器权限配置问题

• 确保服务器上的文件和目录有正确的读取权限

• 检查 nginx/apache 的用户权限配置

• 提问者 咖啡有点苦 #1

  老师，我又在本地试了试就发现了报错，我项目"build-storybook": "storybook build",执行这个命令后，打包后的storybook-static，在index.html里使用open with liveServe就可以打开文档，但是我使用open in defaultr browser就报错了，报错信息：
  Access to script at 'file:///D:/Leo-Design/storybook-static/sb-manager/runtime.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: chrome-extension, chrome-untrusted, data, edge, http, https, isolated-app.
  runtime.js:1 
          Failed to load resource: net::ERR_FAILED
  index.html:1  Access to script at 'file:///D:/Leo-Design/storybook-static/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: chrome-extension, chrome-untrusted, data, edge, http, https, isolated-app.
  common-manager-bundle.js:1 
          Failed to load resource: net::ERR_FAILED
  我搜了一下，说是同源策略的问题，但是这个是静态文件啊，不牵扯跨域啊，为啥会启动不起来啊，那要是这个open in browse本地就启不起来，那我部署到线上服务器上，自然而然也启动不起来啊

• 张轩 回复 提问者 咖啡有点苦 #2

  你这个直接应该不能直接用浏览器打开，因为这样就用的是本地文件地址，自然不行了，使用 liveServer 是对的，你需要一个服务器才能部署静态文件，所以在本地是没问题的。