Почему сначала нужно писать import, а только потом require?

Question

[qqqaa]

Пишу приложение на реакте, вот код одного из компонентов:

import "./styles.css"
const pict = require("../../../../../ONLY_FOR_DEVELOPMENT_imgs/avatar_picture.jpg")

const HeaderPanel = () => {
  return(
    <>
      ...
    </>
  )
}

export {HeaderPanel}

Как видно, сначала идет импорт, а потом require. Но если сделать вот так:

const pict = require("../../../../../ONLY_FOR_DEVELOPMENT_imgs/avatar_picture.jpg")
import "./styles.css"

const HeaderPanel = () => {
  return(
    <>
      ...
    </>
  )
}

export {HeaderPanel}

То выдается ошибка:


Почему так, почему нужно писать именно в таком порядке? Так исторически сложилось?

Comments

[WbICHA]

Почему так, почему нужно писать именно в таком порядке? Так исторически сложилось?

Потому что ты так настроил линтер...

[qqqaa]

WbICHA, хорошо, как его перенастроить? Я использую VSCode

Answer 1

[Василий Банников]

Тк ошибку выдаёт eslint - у тебя такие настройки значит.
Там написан номер правила и ты можешь подробнее о нём почитать

Comments

[qqqaa]

Спасибо, попробую

Answer 2

[Семён Окулов]

А в чем, собственно, прикол использовать require и import в одном проекте? лучше придерживаться чего-то одного