小编Moh*_*ADI的帖子

使用vite js捆绑我的库，我需要同时提供两个版本：

• 生产用途
• 通过 devtools 集成开发特定代码和警告。

当我使用 webpack 时，我有：

module.exports = [
  defaultUmdBuild("production"),
  defaultUmdBuild("development"),
];

它输出两个文件，然后我的库有这个入口点：

'use strict';

if (process.env.NODE_ENV === 'production') {
  module.exports = require('./mylib.production.js');
} else {
  module.exports = require('./mylib.development.js');
}

如何使用 vite 做同样的事情？

谢谢。

我正在使用 React Context API，发现提供程序在每次值更改时都会渲染两次。

这是我所做的。

1. 创建了一个上下文，然后创建了一个呈现其提供者的组件。
2. 提供者提供状态值及其设置器。
3. 创建了一个直接渲染其子级的直接子级。
4. 创建了一个读取上下文值并添加一个按钮来更改它的消费者。
5. 每个组件在渲染时都会执行 console.log。
6. 向提供程序添加了效果，无需每次渲染时都进行记录。
7. 在提供程序中添加了一个引用，该引用在每次渲染时都会递增，并且会记录在渲染和效果中。

问题 ？

每次我点击按钮更改上下文值时，提供程序都会渲染两次，但效果仅执行一次。

因此 ref 总是递增两次，但效果每次只获取最后一个值（它会跳过一个值！）。

另外，在提供程序的第一次渲染时，它会记录两次相同的引用值，这对我来说非常奇怪。

谁能告诉我为什么我会出现这种行为？

这是代码：

提供者：

const MyContext = React.createContext(0);

function Provider({ children }) {
  const state = React.useState("Yes");
  const ref = React.useRef(0);
  ref.current += 1;
  console.log("Context provider ", ref.current);
  React.useEffect(() => {
    console.log("effect on provider, ref value = ", ref.current);
  });

  return <MyContext.Provider value={state}>{children}</MyContext.Provider>;
}

两个孩子

function DirectChild({ children }) {
  console.log("provider direct child");
  return children;
}

function Consumer() {
  console.log("consumer");
  const …

在从 webpack 迁移到 vite 的过程中，我们用来process.env.NODE_ENV添加特定的代码。

现在使用 vite，捆绑包包含了开发模式下的所有内容，包括process.env.NODE_ENV.

这里是vite.config.js：

import path from 'path'
import { defineConfig } from 'vite'

/**
 * @type {import('vite').UserConfig}
 */
export default defineConfig(({mode}) => {
  console.log('vite configuration for mode', mode);
  return {
    define: {
      NODE_ENV: "production",
    },
    build: {
      mode: "development",
      lib: {
        name: 'MyLib',
        fileName: 'mylib.production',
        entry: path.join(process.cwd(), "src/index.ts"),
      },
      rollupOptions: {
        external: 'react',
        output: [
          {
            format: 'umd',
            globals: { react: 'react' },
            entryFileNames: `mylib.production.js`,
          },
        ]
      }
    } …

所以我决定开始使用 CompletableFutureJava8,我无法弄清楚这个片段有什么问题:

public static void main(String...strings) throws Exception {
    final Supplier<User> makeUserSupplier = () -> makeUser();
    final Supplier<String> uuidSupplier =  () -> makeUUID();

    final CompletableFuture<User> futureUser = CompletableFuture.supplyAsync(makeUserSupplier);
    final CompletableFuture<String> futureUUID = CompletableFuture.supplyAsync(uuidSupplier);

    CompletableFuture.allOf(futureUser, futureUUID)
        .thenApplyAsync(aVoid -> {
            final User user = futureUser.join();
            final String uuid = futureUUID.join();
            return "received user + " + user + " and uuid is " + uuid ;
        })
        .handle((ok, e) -> {
            System.out.println("ok----" + ok);
            System.out.println("e----" + e);
            return null;
        });
} …