小编Str*_*ch0的帖子

我正在构建一个 React 组件包，并希望将我的测试文件夹排除在从汇总构建的 dist 文件中捆绑之外。

运行后我的文件结构如下所示rollup -c

.\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 dist\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 index.js\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 tests\n\xe2\x94\x82      \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 index.test.js\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 src\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 index.tsx\n\xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 tests\n\xe2\x94\x82      \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 index.test.tsx\n

我的汇总配置如下所示：

import typescript from 'rollup-plugin-typescript2'\n\nimport pkg from './package.json'\n\nexport default {\n  input: 'src/index.tsx',\n  output: [\n    {\n      file: pkg.main,\n      format: 'cjs',\n      exports: 'named',\n      sourcemap: true,\n      strict: false\n    }\n  ],\n  plugins: [typescript()],\n  external: ['react', 'react-dom', 'prop-types']\n}\n

dist在运行汇总时，如何排除我的测试目录被捆绑到文件中？

我想创建一个响应方块的网格布局.

我觉得我应该能够使用CSS网格布局,但无法将每个方块的高度设置为等于宽度.

也难以在每个方格之间设置排水沟.

使用flexbox会更好吗？

目前我的HTML看起来像这样,但是会动态的,所以可以添加更多的正方形.当然,它需要具有响应性,因此最好使用媒体查询将其折叠为一列.

<div class="square-container">

  <div class="square">
    <div class="content">
    </div>
  </div>

  <div class="square">
    <div class="content spread">
    </div>
  </div>

  <div class="square">
    <div class="content column">
    </div>
  </div>

</div>

使用css网格,这是我得到的

.square-container{
    display: grid;
    grid-template-columns: 30% 30% 30%;
    .square {

    }
}

我能够进一步使用flexbox并且能够使用间隔来将正方形与一个漂亮的排水沟对齐,但仍然在努力使高度与每个正方形的宽度相匹配.

我无法找到任何与flexbox或网格相关的示例,但任何示例都将受到赞赏.

谢谢

出于某种原因,我很难访问Google日历.

我希望能够从我的Node.js服务器添加和删除日历中的事件.

我从文件中发现了非常矛盾的信息.

我关注了 - https://developers.google.com/identity/protocols/OAuth2ServiceAccount,它提供了有关如何获取帐户令牌的良好指南,但最后它似乎仅用于访问云端硬盘.

然后我按照谷歌日历API v3访问未配置,这表明你只需要一个API密钥,但这看起来好像它是从客户端完成所以可能它是不同的？

我也查看了https://developers.google.com/google-apps/calendar/quickstart/nodejs,但这对于对日历进行简单的API调用似乎非常复杂.示例代码引用的文件不清楚它们来自何处或如何构造它们.例如var TOKEN_PATH = TOKEN_DIR + 'calendar-nodejs-quickstart.json';

关于如何实现这一目标的简单指南将非常受欢迎.

谢谢

如果要通过组件props将对象传递给子组件,是否会克隆此对象,或者只是将引用传递给原始对象？

例如,我App.js在导入一个JSON对象ENTRY_DATA.然后我通过props将该对象传递给我的子组件(或者在这种情况下,路由).我是通过这样做来节省内存还是像我要ENTRY_DATA在每个组件上导入一样？

import React, { Component } from 'react';
import { withRouter, Route } from 'react-router-dom'
import ENTRY_DATA from './../../entry_data.json';


import Register from '../Register/Register';
import Categories from '../Categories/Categories';
import Category from '../Category/Category';
import Entry from '../Entry/Entry';

class App extends Component {

  render() {

    return (
      <div className="app" >

        <main>
          <Route exact path="/" component={Register} />
          <Route exact path='/categories' render={(props) => (
            <Categories {...props} categories={ENTRY_DATA} />
          )}/>
          <Route exact path='/categories/:category' render={(props) => (
            <Category {...props} categories={ENTRY_DATA} …

我正在尝试设置一个包含我的身份验证令牌的 cookie。我可以看到它在响应标头中返回，set-cookie: xxxxxx但无论出于何种原因，浏览器都没有存储 cookie。

在我的反应前端，http://app1.dev:3001我正在进行 POST api 调用：

return axios.get(
  `${apiUrl}/info`,
  { withCredentials: true }
)
.then(res => res.data)
.catch(console.error)

我有一个简单的 Koa 服务器运行 http://localhost:3000

const Koa = require("koa")
const Router = require("koa-router")
const bodyParser = require("koa-bodyparser")
const cors = require("@koa/cors")
const axios = require("axios")
const env = require("./env")
const KeyGrip = require("keygrip")

const app = new Koa()
const router = new Router()
const port = env("port")

const keyList = ["xxxxxxx",]
app.keys = new KeyGrip(keyList, "sha256")

router.get("/info", …

我正在流式传输arrayBuffer以便转换为audioBuffer以便能够收听它。

我正在通过websocket事件接收流

retrieveAudioStream(){
  this.socket.on('stream', (buffer) => {
    console.log('buffer', buffer)
  })
}

该buffer是arrayBuffer，我需要它是一个audioBuffer为了能听它在我的应用程序。

我怎样才能做到这一点？

我有一个简单的故事书项目，其结构如下：

??? .storybook
??? .babelrc
??? package.json
??? node_modules
??? stories
?   ??? index.js

我可以使用以下命令运行配置 start-storybook -p 6006

// .storybook/config.js
import { configure } from '@storybook/react'

function loadStories() {
  require('../stories/index.js')
}

configure(loadStories, module)

现在，我想在目录后面包含一些组件。因此，新的文件结构将是：

??? storybook
?   ??? .storybook
?   ??? .babelrc
?   ??? package.json
?   ??? node_modules
??? stories
?   ??? index.js

现在，我的配置可以从一个目录中调用故事：

// ./storybook/.storybook/config.js
import { configure } from '@storybook/react'

function loadStories() {
  require('../../stories/index.js')
}

configure(loadStories, module)

但似乎故事书现在无法解析文件，即使唯一的变化是故事已被移回文件中。我收到以下错误：

ERROR in ../admin-components/components/Button/Button.js 40:26
Module parse failed: Unexpected token (40:26) …

我想在我的gatsby生成的网站中创建一个使用段塞作为参数的路由。

我有一条路线上的项目清单/projects/<slug>。

通常使用react路由器，我会像这样创建一条路由：

<Route exact path='/projects/:project' component={Projects} /> 

在gatsby中，我似乎必须在./pages目录下创建一个新文件，并创建一条新路由。我有一个页面叫做projects，我尝试查找路由参数，但似乎只有404页面。

// ./pages/projects.js

class SingleProject extends Component {

  state = {
    project: {}
  }

  componentDidMount(){
    const project = this.props.projects.find(project => project.slug === this.props.match.params.project)
    this.setState({project})
  }

  render() {
    return (
      <div className="single-project" >
      </div>
    )
  }
}

export default SingleProject;

如何在gatsby中使用带有参数的路线？

我刚遇到 仅客户端路由，但是我猜这些路由不会静态生成。

我将有一个预定义的列表，所以也许有一种方法可以为每个项目列表创建一个页面？我猜我可以在./pages/projects/<slug>我拥有的foreach项目中手动创建文件吗？

I am trying to authorise my JWT token with passport middleware but the strategy callback function is not getting called.

In my app.js file, I am specifying for my /users routes to use the middleware like so:

app.use('/users', passport.authenticate('jwt', { session: false }), users);

I then have a seperate file ./passport.js (which I have required at the top of my app.js) where I specify my passport strategy:

passport.use(new JWTStrategy({
        jwtFromRequest: ExtractJWT.fromAuthHeaderAsBearerToken(),
        secretOrKey   : 'jwt_secret_key'
    },
    function (jwtPayload, cb) { …

我有一个与阿波罗客户端的应用程序。当用户登录时，我可以查询客户端状态并检索用户，但是，当我刷新页面时，不再设置用户数据。

如您所见，我在我的index.js文件中设置了客户端，然后将其传递给ApolloProvider包装了整个应用程序的文件。

// index.js

const client = () => {
  const cache = new InMemoryCache()

  persistCache({
    cache,
    storage: window.localStorage
  })

  return new ApolloClient({
    uri: graphQLUri,
    credentials: 'include',
    clientState: {
      defaults: {
        locale: "en-GB",
        user: {
          __typename: "User",
          isLoggedIn: false,
          username: "",
          salesChannel: "",
          fullName: ""
        }
      },
      typeDefs: `
        enum Locale {
          en-GB
          fr-FR
          nl-NL
        }
        type Query {
          locale: Locale
        }
      `
    },
    cache
  })
}

ReactDOM.render(
  <ApolloProvider client={client()}>
      <App />
  </ApolloProvider>,
  document.getElementById("root") …