小编jon*_*nes的帖子

使用create-react-app创建React应用时可以有条件地导入资产吗？我知道require语法-例如：

import React from "react";


const path = process.env.REACT_APP_TYPE === "app_1" ? "app_1" : "app_2";

const imagePath = require(`./assets/${path}/main.png`);

export default function Test() {
  return (
      <img src={imagePath} alt="" />
  );
}

但是，无论如何，这都会捆绑我的所有资产。

它将加载正确的映像，但仍将所有文件捆绑在一起，形成最终版本。

当我查看最终构建的开发工具时，即使我只想为加载资产，也可以看到那里的所有资产app_1。

我是否被迫触摸webpack配置，如果是的话，我应该改变什么？还是有另一种方法？

我创建了一个函数，它基本上循环遍历数组并创建文件。我开始使用 Jest 进行测试，以确保一切正常，但我在尝试模拟 Node.js 文件系统时遇到了一些问题。

这是我想测试的函数 - function.ts：

export function generateFiles(root: string) {
  fs.mkdirSync(path.join(root, '.vscode'));
  files.forEach((file) => {
    fs.writeFileSync(
      path.join(root, file.path, file.name),
      fs.readFileSync(path.join(__dirname, 'files', file.path, file.name), 'utf-8')
    );
  });
}

const files = [
  { name: 'tslint.json', path: '' },
  { name: 'tsconfig.json', path: '' },
  { name: 'extensions.json', path: '.vscode' },
];

我一直在阅读周围的内容，但无法真正弄清楚如何用笑话来测试它。没有例子可看。我尝试安装mock-fs这应该是使用模拟版本的 Node.js FS 模块启动和运行的简单方法，但老实说我不知道​​从哪里开始。这是我第一次尝试进行简单的测试 - 这会导致错误，提示“没有这样的文件或目录” - function.test.ts：

import fs from 'fs';
import mockfs from 'mock-fs';

beforeEach(() => {
  mockfs({
    'test.ts': '',
    dir: …

我正在尝试从HTTP请求中获取响应，但是我似乎无法。我尝试了以下方法：

public Form1() {     

    HttpClient client = new HttpClient();
    client.BaseAddress = new Uri("someUrl");
    string content = "someJsonString";
    HttpRequestMessage sendRequest = new HttpRequestMessage(HttpMethod.Post, client.BaseAddress);
    sendRequest.Content = new StringContent(content,
                                            Encoding.UTF8,
                                            "application/json");

发送消息：

    ...
    client.SendAsync(sendRequest).ContinueWith(responseTask =>
    {
        Console.WriteLine("Response: {0}", responseTask.Result);
    });
} // end public Form1()

使用此代码，我可以获取状态代码和一些标头信息，但无法获取响应本身。我也尝试过：

  HttpResponseMessage response = await client.SendAsync(sendRequest);

但是我被告知要创建一个如下所示的异步方法来使其工作

private async Task<string> send(HttpClient client, HttpRequestMessage msg)
{
    HttpResponseMessage response = await client.SendAsync(msg);
    string rep = await response.Content.ReadAsStringAsync();
}

这是发送“ HttpRequest”，获取并打印响应的首选方式吗？我不确定哪种方法是正确的。

到目前为止,我一直在进行同步ajax调用以从数据库中获取事件,然后使用从ajax返回的变量初始化日历(解决方案1).

我已经读过,做同步调用通常被认为是坏的,因为它冻结了浏览器,所以我尝试了另一个选项,将ajax调用直接放在FullCalendar日历初始化的事件数组中(解决方案2).这在第一次加载时提供了很好的体验,因为浏览器由于异步ajax而未被锁定,您可以在构建时看到日历.

然而,这有一个缺点,每次更改视图时,它会重新呈现事件,使用户与第一个相比,体验不那么顺畅.以下是我到目前为止尝试的两个解决方案的代码:

解决方案1:

$(document).ready(function(){
     $.ajax({
         url: 'script.php',
         type: 'POST',
         async: false,
         success: function(response){
              json_events = response;

         }
    });
  $('#calendar').fullCalendar({
       events: JSON.parse(JSON.stringify(json_events)),
  });

});

解决方案2:

 $(document).ready(function(){
       $('#calendar').fullCalendar({

            events: {
                    url: 'script.php',
                    type: 'POST',
                    success : function(response){
                    }
           }
       });

  });

这个"问题"还有其他解决方案吗？是的,我不喜欢解决方案1,因为您在使用日历时不必处理事件的重新呈现,但是在加载页面时没有初始冻结会很好.

编辑: script.php

$events = array();
$query = mysqli_query($link, "SELECT * FROM calendar");
while($fetch = mysqli_fetch_array($query,MYSQLI_ASSOC)) {
   $e = array();
   $e['id'] = $fetch['id'];
   $e['start'] = $fetch['startdate'];
   $e['end'] = $fetch['enddate'];
   array_push($events, $e);
}
echo json_encode($events);

这会有用吗？(对于评论中的戴森)

  events: …