标签: server-side-rendering

当您检查导入的 Vue 组件时，您将得到如下内容：

import ClickB from 'ClickB.vue';
console.log(ClickB);

我已经看到nuxt在那里添加了一个自定义属性（称为_nuxt），就像 一样_ssrRegister。我有两个问题：

1. 如何向组件添加属性？
2. 您可以将该属性从组件传递到其实例吗？

根据 next.js 官方文档：

import React from 'react'
import App from 'next/app'

class MyApp extends App {
  // Only uncomment this method if you have blocking data requirements for
  // every single page in your application. This disables the ability to
  // perform automatic static optimization, causing every page in your app to
  // be server-side rendered.
  //
  // static async getInitialProps(appContext) {
  //   // calls page's `getInitialProps` and fills `appProps.pageProps`
  //   const appProps = await App.getInitialProps(appContext);
  //
  // …

我理解的方式是服务器端渲染（SSR）是服务器渲染页面，然后通过一个流将数据块发送到浏览器，而不是浏览器（客户端）加载 HTML 页面，然后向所有页面发出请求。 JS/CSS等

这是我希望我的网页支持的行为。但是按照Netlify 的指南，可以正常生成静态 HTML 页面并包含所有外部依赖项的链接吗？

这样的话运行不会npm run generate禁用SSR吗？或者我完全误解了这是如何工作的？

我有一个功能组件。基本上，该页面由一个表单组成 - 我需要将一些现有数据填充到表单中并让用户更新它。

我正在使用我编写的一个钩子来处理表单。它的作用是这样的

 const [about, aboutInput] = useInput({
    type: 'textarea',
    name: 'About you',
    placeholder: 'A few words about you',
    initialValue: data && data.currentUser.about,
  })

about是值并且aboutInput是实际的输入元素本身。我也可以向它传递一个初始值。

在组件的开头，我像这样获取数据：

const { data, loading, error } = useQuery(GET_CURRENT_USER_QUERY)

这只在客户端执行，在服务器端data未定义。

因此，此代码仅在我通过另一个客户端页面的链接组件导航到该页面时才有效。

它不适用于：

1. 当我直接访问 URL 时
2. 当我从另一个 SSR 页面（使用 getInitailProps）导航到此页面时

我不想使用生命周期方法/类组件（因为我正在使用钩子，并且希望继续使用功能组件。

在 Next JS 中是否有一个很好的方法来实现这一点并继续使用功能组件？

我有一个使用服务器端渲染的 Nuxt.js 应用程序。但是，在我的其中一个页面中，我需要检测它是否是用于切换其中一个组件的 SSR。创建isSSR标志有哪些可能的方法？

我使用 Angular CLI 9 构建了一个应用程序。我package.json使用以下命令修补了该文件：

{
  "scripts": {
    "build:prod": "ng build --prod --subresource-integrity",
    "prebuild:prod": "TS_NODE_COMPILER_OPTIONS='{\"module\": \"commonjs\"}' ts-node ./sitemap_generator.ts"
  }
}

因此，当我调用 时npm run build:prod，我的 2 个命令将被执行，并且编译器生成的输出文件包含 SRI。

现在，我添加了 appShell ：

npm run ng generate appShell -- --client-project my-project

要使用appShell运行构建，我必须使用以下命令：

npm run ng run my-project:app-shell:production

主要问题

但是这个命令调用文件my-project:build:production的配置angular.json，并且不接受参数--subresource-integrity：/

如何修补它以使用SRI 进行 appShell 生产构建？

勇敢者的第二个问题