Какая разница между подключения реакт через консоль и по ссылке?

Question

[Mark]

Извиняюсь за глупый вопрос, я еще чайник в реате. Какая разница между пидключиннямы реакт через консоль и по ссылке?

Answer 1

[Антон Спирин]

Ваш вопрос к самому React прямого отношения не имеет. Вопрос скорей о типах модулей и способах их использования. По ссылке вы подключаете UMD модуль, и React будет доступен как глобальный объект React или window.React. Работать с таким модулем можно хоть из тега script в html файле:

<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script>
  function Greetings(props) {
    return React.createElement('div', null, 'Hello, World!');
  }
</script>

Когда же вы устанавливаете React как npm пакет. В папку node_modules устанавливается 5 версий модуля React:
2 версии CommonJS модулей: production и development и 3 версии UMD: production, development и prоfiling.
Сам пакет по-умолчанию экспортирует CommonJS модуль. Версия экспортируется в зависимости от переменной окружения process.env.NODE_ENV:

'use strict';

if (process.env.NODE_ENV === 'production') {
  module.exports = require('./cjs/react.production.min.js');
} else {
  module.exports = require('./cjs/react.development.js');
}

Вы используете именно CommonJS модуль, когда пишите в коде импорт из корня пакета:
import React from 'react';
Как правило, современной frontend разработке используется модульная система ES6, экспериментальный синтаксис и такой код требует трансляции в кроссбраузерный код и сборки. Стандартом на этом поприще сейчас являются babel и webpack.

Советую почитать эту статью от Yandex об эволюции модульных систем JavaScript.

Comments

[Mark]

Ок, какое из этих подключений будет лучше?

[Антон Спирин]

Mark Sikr, лучшего нет. Они просто разные. Стандартом сейчас считается подключение CommonJS модуля из npm пакета, в больших проектах такой подход будет удобней. Вам бы я посоветовал для обучения использовать create react app или писать код в codesandbox.