小编Jas*_*ane的帖子

我不确定这是扩展还是更新，但自从最近的 VS 代码更新以来，它们都有与父文件夹内联的单个文件夹。我不认为它会打扰我，但我发现这让我发疯，我更喜欢第一次将子文件夹嵌套在下面，而不是根据我的文件夹结构一直动态更改。

这是一个图像示例，有人知道这个设置叫什么吗？

I am trying to start a Docker container with a react project, the project is created using npm init react-app.

This is my docker file

# Specify a base image
FROM node:alpine

WORKDIR /usr/app

# Install some depenendencies
COPY ./package.json ./
RUN npm install
COPY ./ ./

# Default command
CMD ["npm", "run", "start"]

Docker build . creates an image successfully (with a lot of npm warnings) and then when I run Docker run <image> this is the output in …

我正在尝试扩展第三方私有 npm 模块的主题。项目编译成功，但我不断收到打字稿错误Circular definition of import alias 'externalTheme'

下面是我如何扩展主题。这是完美的工作方式，它同时使用我的主题和外部主题

import { externalTheme, ExternalThemeInterface } from 'external-npm-repo...'

import { colors, ColorsTypes } from './colors'

export const MyTheme: MyThemeInterface = {
    ...theme,
    colors,
}

export interface MyThemeInterface extends ExternalThemeInterface {
    colors: ColorsTypes
}

我得到的错误是引用 externalTheme 导入的循环依赖，我不确定这到底是什么意思，并且在研究时没有找到任何明确的参考。

这些是我的 Typescript 设置

        "allowJs": true,
        "alwaysStrict": true,
        "esModuleInterop": true,
        "forceConsistentCasingInFileNames": true,
        "isolatedModules": true,
        "jsx": "preserve",
        "lib": ["dom", "es2017"],
        "module": "esnext",
        "moduleResolution": "node",
        "noEmit": true,
        "noFallthroughCasesInSwitch": true,
        "noUnusedLocals": true,
        "noUnusedParameters": true,
        "resolveJsonModule": true,
        "skipLibCheck": true,
        "strict": …

我有一个 monorepo，其中包含由样式组件制成的设计系统。在这个设计系统中，我有一个 Heading 组件，它使用 'level' 属性来调整标题的 CSS。

标题

export interface HeadingProps extends HTMLAttributes<HTMLHeadingElement> {
    level: 'colossus' | 'uber' | 'hero' | '1' | '2' | '3' | '4' | '5'
}

export const Heading: React.FC<HeadingProps> = ({ level = '1', children, ...rest }) => {
    return (
        <HeadingStyled level={level} {...rest}>
            {children}
        </HeadingStyled>
    )
}

用法

要使用这个 Heading 组件，我只需向它传递一个level用于样式和asprop 的参数来调整 HTML 的渲染内容。

<Heading as="h2" level="2">
    Header 2
</Heading>

问题

as当我使用这个组件时，我在prop上收到打字稿错误

Type '{ children: string; as: string; …

这个问题之前已经被问过，在过去的两天里我尝试了很多例子来尝试和配置，但没有成功，所以我发布了我的环境以寻求帮助。

问题
Nextjs 使用 Terraform 部署到 kubernetes 后环境变量全部未定义

预期结果

staging: NEXT_PUBLIC_APIROOT=https://apis-staging.mywebsite.com
production: NEXT_PUBLIC_APIROOT=https://apis.mywebsite.com

秘密存储在 github actions 中。我有一个 terraform 设置，可将我的应用程序部署到我的暂存和生产 klusters，下面是一个片段：

env:
  ENV: staging
  PROJECT_ID: ${{ secrets.GKE_PROJECT_STAG }}
  GOOGLE_CREDENTIALS: ${{ secrets.GOOGLE_CREDENTIALS_STAG }}
  GKE_SA_KEY: ${{ secrets.GKE_SA_KEY_STAG }}
  NEXT_PUBLIC_APIROOT: ${{ secrets.NEXT_PUBLIC_APIROOT_STAGING }}

我还有一个额外的步骤来手动创建 .env 文件

    - name: env-file
      run: |
        touch .env.local
        echo NEXT_PUBLIC_APIROOT: ${{ secrets.NEXT_PUBLIC_APIROOT_STAGING }} >> .env.local

Dockerfile

FROM node:16-alpine AS deps
RUN apk add --no-cache libc6-compat

WORKDIR /app
COPY package.json package-lock.json .npmrc ./
RUN npm ci

FROM node:16-alpine AS builder …

我有一个react-chart-js2组件，我试图在填充上制作渐变，但是我遇到了一些不同的打字稿错误，并且似乎无法让它工作。

该文档表示将 data 属性作为函数传递并引用画布，以便访问画布上下文以添加渐变。不幸的是，这不起作用。

这是文件的codesandbox：https://codesandbox.io/s/modest-bird-j2in8（文件LineChartGradient.tsx）

我遇到的错误围绕 Canvas Context 并将数据函数传递给 Chartjs 组件

数据

const data = (canvas: HTMLCanvasElement) => {
    const ctx = canvas.getContext("2d");
    const gradient = ctx.createLinearGradient(0, 0, 0, 200);
    gradient.addColorStop(0, "rgba(250,174,50,1)");
    gradient.addColorStop(1, "rgba(250,174,50,0)");

    return {
      labels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun"],
      datasets: [
        {
          label: "First dataset",
          data: [33, 53, 85, 41, 44, 65],
          fill: "start",
          backgroundColor: "rgba(75,192,192,0.2)",
          borderColor: "rgba(75,192,192,1)"
        },
        {
          label: "Second dataset",
          data: [33, 25, 35, 51, 54, 76],
          fill: "start",
          borderColor: "#742774" …

我正在使用我的一个旧的硬编码网站，并试图从 HTML 中剥离数据并将其放入一个新的 JSON 对象中。

目前我收到一个项目表（为简单起见减少了）作为 1 个巨大的字符串，几乎有 1000 行。任何 HTML 上都没有类或属性

let tableString = `
    <tr>
        <td>01/01/1999</td>
        <td>Item 1</td>
        <td>55</td>
    </tr>
    <tr>
        <td>01/01/2000</td>
        <td>Item 2</td>
        <td>35</td>
    </tr>
`

我正在努力实现以下目标

[{
    date: '01/01/1999',
    name: 'Item 1',
    cost: 55
},
{
    date: '01/01/2000',
    name: 'Item 2',
    cost: 35
}]

我已经实现的当前代码

let newData = []

let stringArray = results.split('</tr>')

stringArray.map(item => {

    let stripped = item.replace('/n', '')
        stripped = stripped.replace('<tr>', '')

    let items = stripped.split('<td>')

    let newItem = {
        data: items[0],
        name: …