小编Aje*_*hah的帖子

在网上看到了几个答案，但没有明确的解释，解决方案也不起作用。所以这就是我想要做的：

• 我有一个包含许多图像（数千张）的文件夹- 目前它保存在src/assets/images文件夹下
• 例如，给定图像列表作为输入，我想动态渲染这些图像。并且不全部导入，因为考虑到疯狂的图像数量这是不可能的

这是我目前的实现方式（不起作用）：

// for example
const imageList = ['img1', 'img2', 'img3' /*...so on */]

const getImagePath = (image) => {
  return `../assets/images/${image}.jpg`
}

function ImagesPage() {
  return (
    <>
      <p>Below should show a list of images</p>
      {imageList.map((img) => {
        return <img src={require(getImagePath(img))} />
      })}
    </>
  )
}

从我在线阅读的内容来看，这与webpack 的工作方式有关，并且只有在将确切的字符串路径输入到以下内容时才会起作用require：

// This works:
<img src={require('../assets/images/img1.jpg')} />

// But all these will not work:
<img …

这是我尝试运行npm run dev.

我不明白发生了什么，我尝试了这些：删除package-lock.json、删除node_modules、重新安装 npm，但没有任何效果。

PS D:\Users\user\Documents\Projects\NLW#5\podcastrnext> npm run dev

> podcastrnext@0.1.0 dev D:\Users\user\Documents\Projects\NLW#5\podcastrnext
> next dev

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info  - Using webpack 5. Reason: no next.config.js https://nextjs.org/docs/messages/webpack5
error - ../../NLW#5/podcastrnext/node_modules/next/dist/client/dev/amp-dev.js
Error: Cannot find module 'D:\Users\user\Documents\Projects\NLW#5\podcastrnext\node_modules\@next\react-refresh-utils\loader.js'
Require stack:
- D:\Users\user\Documents\Projects\NLW#5\podcastrnext\node_modules\next\dist\compiled\webpack\bundle5.js
- D:\Users\user\Documents\Projects\NLW#5\podcastrnext\node_modules\next\dist\compiled\webpack\webpack.js
- D:\Users\user\Documents\Projects\NLW#5\podcastrnext\node_modules\next\dist\next-server\server\config-utils-worker.js
- D:\Users\user\Documents\Projects\NLW#5\podcastrnext\node_modules\next\dist\next-server\server\config-utils.js
- D:\Users\user\Documents\Projects\NLW#5\podcastrnext\node_modules\next\dist\next-server\server\config.js
- D:\Users\user\Documents\Projects\NLW#5\podcastrnext\node_modules\next\dist\server\next.js
- D:\Users\user\Documents\Projects\NLW#5\podcastrnext\node_modules\next\dist\server\lib\start-server.js
- D:\Users\user\Documents\Projects\NLW#5\podcastrnext\node_modules\next\dist\cli\next-dev.js
- D:\Users\user\Documents\Projects\NLW#5\podcastrnext\node_modules\next\dist\bin\next
<i> [webpack.cache.PackFileCacheStrategy/webpack.FileSystemInfo] Node.js doesn't offer a (nice) way to introspect the ESM …

这个问题的标题是 Angular CLI 编译器抛出的消息。

我的 app.component.ts 中有这个构造函数：

    export class AppComponent {
      constructor(private userService: UserService, private auth: AuthService, router: Router) {
       auth.user$.subscribe(user => {
        if (user) {
         userService.save(user);

         let returnUrl = localStorage.getItem('returnUrl');
         router.navigateByUrl(returnUrl);
      }
    });
  }
}

在上面附加的代码部分中，我在“returnURL”处加了下划线，如果我将光标移到上面，它会显示：

“‘string | null’类型的参数不可分配给‘string | UrlTree’类型的参数。‘null’类型不可分配给‘string | UrlTree’类型。”

我有一个与 Firebase 相关的 user.service.ts：

    import { Injectable } from '@angular/core';
    import { AngularFireDatabase } from 'angularfire2/database';
    import * as firebase from 'firebase';

    @Injectable()
    export class UserService {

        constructor(private db: AngularFireDatabase) { }
  
          save(user: firebase.User) {
          this.db.object('/users/' …

我创建了一个Angular 2应用程序,我正在寻找使用Apache Cordova创建一个Android应用程序.当我在Marshmallow模拟器中加载应用程序时,应用程序不会加载任何声明的资源.如果我使用浏览器插件,它按预期工作.使用Chrome检查设备的控制台会显示以下输出.

Chrome控制台输出:

如果我运行Cordova初始样本,它在同一Android模拟器中工作,因此它必须是源的问题.可以在Github存储库中检查代码.该应用程序位于www目录中,用于测试是否需要添加android平台.

$ cordova platform add android
$ cordova run android

我找不到这个问题的答案:

• 资源看起来很好 - 丢弃文件路径问题.
• 浏览器插件工作(Chrome) - 丢弃应用程序错误和安全策略.
• cordova样本按预期用于Android - 丢弃环境错误.

请问,有谁知道这个设置有什么问题？

我有一个使用 React 和 Redux 的 APP，我想NotFound在用户输入无效路由时加载一个组件。我在网上找到了解决这个问题的方法，就是把所有的路由都放在一个交换机里面，包括NotFound组件。

问题是，在我的应用程序中，我不能将所有路由都放在 Switch 中，因为有一个组件需要拉伸到整个页面，而所有其他组件都需要在“容器”中。我在下面使用它的方式（请参阅代码），该NotFound组件适用于所有情况，除非我在“着陆”组件路线上（该NotFound组件始终显示）。

我试图将着陆组件放在Switch带有“容器”div 的内部，但应用程序崩溃了。

有没有办法解决这个问题？（将着陆组件放在容器外面，其他组件放在里面）

class App extends Component {
  render() {
    return (
      <Provider store={store}>
        <Router>
          <div className="App">
            <Navbar />
            <Route exact path="/" component={Landing} />
            <div className="container">
              <Switch>
                <Route exact path="/register" component={Register} />
                <Route exact path="/login" component={Login} />
                <Route exact path="/profiles" component={Profiles} />
                <Route exact path="/profile/:handle" component={Profile} />
                <PrivateRoute exact path="/dashboard" component={Dashboard} />
                <PrivateRoute
                  exact
                  path="/create-profile"
                  component={CreateProfile}
                />
                <PrivateRoute
                  exact
                  path="/edit-profile"
                  component={EditProfile} …

我正在用 React 编写一个应用程序，需要一种在深色模式和浅色模式之间切换的方法。我在 blueprintjs 文档中找不到任何提到如何使用某些父 prop 配置更改所有子组件的主题的文档。

我使用 Redux 创建了一个 CRUD 应用程序，因此，我编写了代码，并在导出组件时添加了以下行：

AddContact.PropTypes = {
  addContact: PropTypes.func.isRequired
};

export default connect(null, { addContact })(AddContact);

但是，它显示了这个错误

./src/components/contact/AddContact.js
  Line 461:12:  Typo in static class property declaration  react/no-typos
Search for the keywords to learn more about each error.

我制作了一个侧边栏，其中包含“主页”和“搜索”页面的导航。但是，我想要的是，我只需要在“主页”页面上显示侧边栏，而不在“搜索”页面上显示侧边栏。这是我现在拥有的
App.js：：

import React from "react";
import "./App.css";

import SideBar from "./components/SideBar";
import Home from "./screens/Home";
import Search from "./screens/Search";

import { BrowserRouter as Router, Switch, Route } from "react-router-dom";

function App() {    
  return (
    <div className="app">
      <Router>
    <Switch>
      <SideBar />
      <Route exact path="/home">
        <Home />
      </Route>
    </Switch>

    <Switch>
      <Route exact path="/search">
        <Search />
      </Route>
    </Switch>
  </Router>
    </div>
  );
}

export default App;

但是，它在两个页面上都显示侧边栏。

编辑：

我不希望当路线改变时侧边栏重新渲染。侧边栏中有指向“主页”和“搜索”页面的链接。我只想渲染和重新渲染这些页面。