标签: netlify

如何防止 Netlify 将警告视为错误,因为 process.env.CI = true?

在 Netlify 上部署新项目开始失败。检查日志,我看到以前成功部署的日志中没有的内容:

Treating warnings as errors because process.env.CI = true.
Most CI servers set it automatically. 
Failed to compile.
Run Code Online (Sandbox Code Playgroud)

我该如何修复我的构建?

javascript npm netlify

37
推荐指数
5
解决办法
3万
查看次数

Netlify 在页面刷新时呈现 404(使用 React 和 react-router)

我已经使用 Netlify 部署了我的站点,但在路由方面遇到了问题。

这是我的网站:https : //redux-co.netlify.com/

还有我的 GitHub 仓库:https : //github.com/jenna-m/redux-co

具体来说,如果用户导航到主页以外的任何页面并刷新页面,则默认 Netlify 404 呈现。从 404 页面,如果我导航回主页并刷新,则呈现主页。

此外,我的自定义 404 页面无法像我打开时那样工作localhost:3000,但我想在处理我的自定义 404 组件之前先弄清楚这个刷新问题。

我正在使用 React 和 react-router,我知道由于我使用的是 react-router,我的网站不会立即部署。


这是我的_redirects文件,它在/public我的index.html文件所在的文件夹中:

/*    /index.html   200
Run Code Online (Sandbox Code Playgroud)

这是我“build”位于package.json

…
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build && cp build/index.html build/404.html",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  }
…
Run Code Online (Sandbox Code Playgroud)

我读过其他人遇到过这种情况以及他们为克服这个问题所做的工作。这是我到目前为止所引用的……

https://www.freecodecamp.org/news/how-to-deploy-a-react-application-to-netlify-363b8a98a985/

https://hugogiraudel.com/2017/05/13/using-create-react-app-on-netlify/

这个人使用的是 Vue 而不是 React,但我还是尝试了这些解决方案:

https://github.com/vuejs/vuepress/issues/457#issuecomment-390206649

https://github.com/vuejs/vuepress/issues/457#issuecomment-463745656

http-status-code-404 reactjs react-router netlify

34
推荐指数
4
解决办法
1万
查看次数

我正在尝试在 netlify 上托管我的 React 网站,但出现 npm 安装错误

我需要一些帮助!我正在尝试在 netlify 上托管我的 reacy 网站,但发生 npm 安装错误。你能帮我解决这个问题吗?

这里有一个错误评论

12:28:19 AM: Installing NPM modules using NPM version 7.24.0
12:28:21 AM: npm ERR! code ERESOLVE
12:28:21 AM: npm ERR! ERESOLVE unable to resolve dependency tree
12:28:21 AM: npm ERR!
12:28:21 AM: npm ERR! While resolving: simplefolio@1.0.1
12:28:21 AM: npm ERR! Found: webpack@5.54.0
12:28:21 AM: npm ERR! node_modules/webpack
12:28:21 AM: npm ERR!   dev webpack@"^5.40.0" from the root project
12:28:21 AM: npm ERR!
12:28:21 AM: npm ERR! Could not resolve dependency:
12:28:21 AM: npm …
Run Code Online (Sandbox Code Playgroud)

npm reactjs netlify

27
推荐指数
4
解决办法
1万
查看次数

vue:未捕获TypeError:无法读取未定义的属性....

我正在使用vue@2.1.3和vue官方webpack模板来构建应用程序.

在本地开发时,我经常看到警告Uncaught TypeError: Cannot read property ... of undefined,但HTML可以成功呈现.但是,当使用npm run build命令将HTML部署到Netlify时,无法呈现HTML .所以我必须认真对待这个警告.

我从这里了解到,这是因为"在呈现组件时数据不完整,但是例如从API加载." 解决方案是" v-if只在数据加载后才用于渲染模板的那一部分."

有两个问题:

  1. 我尝试包含v-if多个语句,这些语句产生了警告,但个人认为这个解决方案很冗长.有一个整洁的方法吗?
  2. 本地开发中的"警告"在生产中变成"致命错误"(HTML无法呈现).如何使它们一样?例如,他们两个都发出警告或错误?

vue.js vue-component netlify

20
推荐指数
3
解决办法
4万
查看次数

在Netlify上托管时设置电子邮件

想知道是否有人在使用Netfliy托管网站时设置电子邮件的经验?我使用谷歌域名注册了一个域名,并将名称服务器指向托管盖茨比静态站点的Netlify.我想在共享主机帐户上设置一封电子邮件(我正在使用hostpapa).

Netlify DNS已设置且网站已上线.我已经尝试将A记录设置为托管IP,将MX记录设置为mail.domain ...以Netlify DNS和Google Domain记录...我想问题可能是名称服务器应该首先指向哪里......在这两种情况下,名称服务器仍然指向托管站点的Netlify,我收到以下错误:

请将域转移到此服务器名称服务器,或让管理员将其中一个名称服务器添加到/etc/ips.remotedns并在该远程名称服务器上创建正确的A条目.

dns mx-record nameservers netlify google-domains

16
推荐指数
2
解决办法
8115
查看次数

为什么 Yarn 会失败并出现“未找到候选者”错误?

例如,我尝试netlify-cli使用以下命令从 17.7.0 升级到 17.8.1yarn upgrade-interactive,并发生以下错误:

\n
\xe2\x9e\xa4 YN0000: \xc2\xb7 Yarn 4.0.2\n\xe2\x9e\xa4 YN0000: \xe2\x94\x8c Resolution step\n\xe2\x9e\xa4 YN0082: \xe2\x94\x82 @netlify/zip-it-and-ship-it@npm:9.28.1: No candidates found\n\xe2\x9e\xa4 YN0000: \xe2\x94\x94 Completed in 1s 602ms\n\xe2\x9e\xa4 YN0000: \xc2\xb7 Failed with errors in 1s 617ms\n
Run Code Online (Sandbox Code Playgroud)\n

\n
\xe2\x9e\xa4 YN0000: \xc2\xb7 Yarn 4.0.2\n\xe2\x9e\xa4 YN0000: \xe2\x94\x8c Resolution step\n\xe2\x9e\xa4 YN0082: \xe2\x94\x82 @formkit/vue@npm:^1.3.0: No candidates found\n\xe2\x9e\xa4 YN0000: \xe2\x94\x94 Completed in 22s 953ms\n\xe2\x9e\xa4 YN0000: \xc2\xb7 Failed with errors in 22s 972ms\n
Run Code Online (Sandbox Code Playgroud)\n

根据 npmjs.com 包@netlify/zip-it-and-ship-it可在所请求的版本中使用:

\n

在此输入图像描述

\n

我最近在使用不同的软件包时多次遇到此错误。 …

netlify yarnpkg netlify-cli yarnpkg-v2

16
推荐指数
1
解决办法
2353
查看次数

将_redirects文件添加到Netlify上托管的Vue SPA的根路径

我正在使用Vue CLI开发单页应用程序,并希望历史状态pushstate工作,所以我得到干净的URL.

我必须遵循这个:https://www.netlify.com/docs/redirects/#history-pushstate-and-single-page-apps并使用以下内容将_redirects文件添加到我的站点文件夹的根目录:

/*    /index.html   200
Run Code Online (Sandbox Code Playgroud)

问题是我不知道如何将此_redirects文件添加到我的dist文件夹的根目录.我尝试将它添加到静态文件夹,但它最终在子文件夹中而不是在root中.如何在Netlify上部署此文件以使历史模式有效?

// config/index.js
build: {
  // Paths
  assetsRoot: path.resolve(__dirname, '../dist'),
  assetsSubDirectory: 'static',
  assetsPublicPath: '/',
Run Code Online (Sandbox Code Playgroud)

single-page-application vue.js netlify vue-cli

15
推荐指数
5
解决办法
5319
查看次数

在 Nuxt 2.14 通用模式中 target: 'static' 和 target: 'server' 之间的真正区别是什么?

在最新版本的 Nuxt (2.14) 中,他们引入了在不更改代码时构建应用程序的优化(以显着缩短构建时间)。

我在 jamstack 中制作网站,在 netlify 上部署nuxt generate,直到现在,使用target: 'server'. 我尝试了新target: 'static'的以利用这个新功能,但我的代码不会构建,因为在这种模式下,应用程序似乎无法访问this.$route以生成动态页面。

所以,我的问题是:这彼此有何不同?当我切换target到我要注意什么?

static vue.js netlify nuxt.js jamstack

15
推荐指数
1
解决办法
4055
查看次数

Next.js <Image /> 组件在 Netlify 上较慢,在 Vercel 上较快

我有一个相对简单的 Next.js 应用程序,并使用 Next.js 的<Image />组件来渲染两个小图像,如下所示:

<Row className="justify-content-center m-0 mt-3 text-center">
  <Col xs={4} md={3} lg={2} className="pr-xs-0  pr-sm-5 pl-0">
    <Image
      src="/assets/images/logo1.png"
      alt="Logo etc1"
      width={320}
      height={150}
    />
  </Col>
  <Col xs={4} md={3} lg={2} className="pl-xs-0 pr-0 pl-sm-5">
    <Image
      src="/assets/images/logo2.jpg"
      alt="Logo etc2"
      width={320}
      height={150}
    />
  </Col>
</Row>
Run Code Online (Sandbox Code Playgroud)

这两个小镜像(每个约 50Kb)在开发过程中可以立即加载,但在 Netlify 上部署时却花费了相当长的时间(最多 4 秒!!)。

部署到 Vercel 的完全相同的存储库可以立即渲染图像。

值得一提的是,使用普通的 html<img />标签在 Vercel 和 Netlify 上渲染它们的速度都非常快,但是当使用 Next.js 组件延迟加载时,我很困惑地看到这样不显眼的图像在 Netlify 上加载需要多长时间<Image />

我有什么遗漏的吗?

reactjs netlify next.js

12
推荐指数
1
解决办法
3920
查看次数

使用 react-router-dom 时,Netlify 无法识别 URL 参数

我正在创建一个使用反应路由器的反应应用程序。我正在使用路由器来匹配路径,:/bankName-:credit并且它在本地开发中运行良好。我的应用程序唯一需要的路径是:/bankName-:credit,其他所有路径都会命中404. 但是,当我将此应用程序部署到 netlify 时,默认情况下它会转到/并显示自定义404. 这一切都很好。但是现在如果我尝试去,/hdfc-500那么它会给出一个 netlify not found 消息,说明page not found.

我尝试使用netlify 文档中_redirects提到的方法,但这不起作用。

这是我的路线:-

应用程序.js

<Route path='/:bankCode-:credit' component={NestedRoutes} />
<Route component={NotFound} />
Run Code Online (Sandbox Code Playgroud)

这是我的NestedRoutes组件:-

const NestedRoutes = ({ match }) => (
  <Suspense fallback={<LinearProgress />}>
    <Switch>
      <Route exact path={`${match.path}/sc-generate`} component={SCGenerate} />
      <Route exact path='/:bankCode-:credit' component={Home} />
      <Route component={NotFound} />
    </Switch>
  </Suspense>
)
Run Code Online (Sandbox Code Playgroud)

我在我的_redirects文件中使用以下代码:-

/* /:bankCode-:credit
Run Code Online (Sandbox Code Playgroud)

但它试图完全匹配 /:bankCode-:credit

我该怎么做才能解决这个问题?

deployment reactjs react-router netlify netlify-cli

11
推荐指数
1
解决办法
3243
查看次数