Т
За бугром мало кто вебпак для React'a вручную конфигит, это у нас какая-то нездоровая тенденция
Статистика какая то есть? Или фантазии?
Size: a a a
2021 March 08
MZ
Как делается своя сборка: гуглишь статьи, вставляешь код в свой конфиг, и говоришь твоя сборка)
Не знаю, не знаю
D
Daniyar
APP.js
import React from 'react';init.js
import { Switch, Route, Redirect } from 'react-router-dom';
import React from 'react';
import { render } from 'react-dom';
import { BrowserRouter } from 'react-router-dom';
import { Provider } from 'react-redux';
import { configureStore } from '@reduxjs/toolkit';devServer.historyApiFallback - решило проблемуD
Как делается своя сборка: гуглишь статьи, вставляешь код в свой конфиг, и говоришь твоя сборка)
А потом тратишь полдня, чтобы что-то подцепить
D
я 2 дня (по 6 часов день собирал свой cra). Это в первый раз
D
но лучше cra нет ничего)
D
Я не против того, чтобы знать webpack, его надо знать, надо уметь читать и писать, но мы же должны что-то выпускать ещё как разработчики.
ЕБ
import React, { Component } from 'react';
import './App.css';
import { Switch, NavLink, Route, withRouter, BrowserRouter} from 'react-router-dom';
import Card from './components/Card';
class App extends Component<any, any> {
render() {
return <>
<div className="app-container">
<div>App</div>
<BrowserRouter>
<Route path={'/card'}>
<Card/>
</Route>
<Route path={'/'} exact>
<NavLink to={'/card'}>card</NavLink>
</Route>
</BrowserRouter>
</div>
</>
}
}
export default withRouter(App);
и такой компонент Card import { Component } from 'react';
import './styles.scss';
import { Route, Switch, NavLink, withRouter } from 'react-router-dom';
import { About } from '../About';
class Card extends Component<any, any> {
constructor(props: any) {
super(props);
}
render() {
return <>
<Route path={this.props.match.path + '/about'}>
<div>!!!!!!!!!!!!</div>
<About/>
</Route>
<Route path={this.props.match.path}>
<div>Card</div>
<NavLink to={this.props.match.path + '/about'}>About</NavLink>
</Route>
</>
}
}
export default withRouter(Card);эээ, я просёк, тут как бы фишка в наличии/отсутствии
exact у роута /card в App.tsxMZ
Евгений Баранников
эээ, я просёк, тут как бы фишка в наличии/отсутствии
exact у роута /card в App.tsxДа
D
Статистика какая то есть? Или фантазии?
Github, тег react, выбирайте не библиотеки, а такие репозитории, от таких же рядовых разработчиков
ЕБ
эээ, ну это полумера, потому что в таком случае грузятся оба компонента (выводят своё содержимое), и
Card и About ... а нужно чтобы только AboutNT
Евгений Баранников
эээ, ну это полумера, потому что в таком случае грузятся оба компонента (выводят своё содержимое), и
Card и About ... а нужно чтобы только Aboutв документации все написано
ЕБ
Nikita Titov
в документации все написано
видел только про функциональные компоненты, для классовых это не работает https://reactrouter.com/web/guides/quick-start/2nd-example-nested-routing
Т
Github, тег react, выбирайте не библиотеки, а такие репозитории, от таких же рядовых разработчиков
не репрезентативно
NT
ну так пиши на функциональных
D
Кстати, если в вебпаке
devServer: hot: true реакту нужен обязательно react-hot-loader ?ЕБ
Nikita Titov
ну так пиши на функциональных
на классовых нужно
MZ
Евгений Баранников
эээ, ну это полумера, потому что в таком случае грузятся оба компонента (выводят своё содержимое), и
Card и About ... а нужно чтобы только AboutВместо path «this.props.match.path» у вложенного роута сделай «this.pros.match.path + ‘/somename’”
Вот тут поменяй паз у Route
Вот тут поменяй паз у Route
<Route path={this.props.match.path}>
<div>Card</div>
<NavLink to={this.props.match.path + '/about'}>About</NavLink>
</Route>MZ
Евгений Баранников
эээ, ну это полумера, потому что в таком случае грузятся оба компонента (выводят своё содержимое), и
Card и About ... а нужно чтобы только AboutИ в Card копонент добавь <Redirect to={this.props.match.path + ‘/somename’}/>
MZ
Евгений Баранников
эээ, ну это полумера, потому что в таком случае грузятся оба компонента (выводят своё содержимое), и
Card и About ... а нужно чтобы только AboutRedirect из react-router-dom