Мы используем настройку React + Webpack.Традиционный способ импорта библиотек и компонентов выглядит примерно так:
import React from 'react'
import styled from 'styled-components'
import Button from '../components/Button'
Моя идея состоит в том, чтобы собрать все пакеты и компоненты в один файл.Примерно так:
/common/index.js:
import React from 'react'
import styled from 'styled-components'
import Button from '../components/Button'
export {React,styled,Button}
Затем в других файлах я могу просто сделать
import {React,styled,Button} from '../common'
Я использовал этот шаблон на сервереза последние несколько недель.Это делает импорт быстрее (печатать разумно).Это также избавляет от проблемы, связанной с тем, что файлы имеют около 10 импортов (особенно во внешнем интерфейсе), а импорт занимает большую часть экрана (наиболее ценную часть экрана ...)
Что вы думаетеоб этом?
Есть ли какие-либо потери производительности для этого?Я действительно не предполагаю ничего из-за волшебства Webpack (но я хотел бы подтвердить это, прежде чем я проведу рефакторинг сотен импортов :)).Есть ли другие непредвиденные последствия?Или это просто дело вкуса?
PS Вы можете сказать - «Теперь каждый раз, когда я создаю новый компонент, мне нужно импортировать и экспортировать его в /common/index.js».Я думаю, что вы можете использовать нативный require.context Webpack для этого.Так что никакой дополнительной работы.
Ура !!