Рубрики
Без рубрики

Настройка приложения React Application с WebPack 4, Babel и Nodejs Server (часть 1)

Сегодня я собираюсь объяснить, как я использую Babel, чтобы настроить проект в включении ES6 при работе в узле и как WebPack можно использовать при работе с React. В этой установке приложение мы очевидно …

Автор оригинала: Michael Obasi.

Сегодня я собираюсь объяснить, как я использую Babel, чтобы настроить проект в включении ES6 при работе в узле и как WebPack можно использовать при работе с React.

В этой установке приложение мы, очевидно, нужно иметь узел, установленный рядом с НПМ (или пряжей) – установка для этого находится за пределами объема для этого руководства. Чтобы установить NODEJS Следуйте по ссылке на это руководство Как установить Nodejs Отказ

Чтобы убедиться, что у вас есть узел и NPM, установлена эта команда на вашем терминале. Узел -в , NPM -V.

Далее мы теперь будем создавать пустой проект для этого приложения на настройке и навигация в него.

mkdir setup_application
cd setup_application

Далее мы будем использовать NPM init Команда для создания файла Package.json для вашего приложения. Эта команда предлагает вам ряд вещей, включая имя и версию вашего приложения и имя файла начальной точки входа (по умолчанию это index.js). На данный момент просто примите значения по умолчанию. Для быстрого использования настроек

npm init -y

Если вы отобразите Package.json file Cat Package.json , вы увидите, что вы приняли, которые вы приняли, заканчивая лицензией.

{
  "name": "setup_application",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

Далее мы установим Экспресс в приложение.

npm install express --save

Далее мы создадим входной файл, в котором мы настроим свой экспресс-сервер в прислушивании порта 8000 Отказ

const express = require('express');
const path = require('path');

const app = express();

app.get('*', (req, res) => {
  return res.send('Welcome to our setup application');
});

const { log } = console;

const PORT = 8000;

app.listen(PORT, () => {
  log('Server started on port: ', PORT);
});

Babel Setup.

Babel позволяет вам написать код в версии JavaScript ES6 (ES2015) и за пределы которого еще не поддерживается в большинстве браузера. С Babel код будет передан обратно в Vanilla JavaScript, чтобы каждый браузер, не имея все функции JavaScript ES6 и за пределы функций, может интерпретировать его. Для того, чтобы получить работу Babel, вам нужно установить две свои основные зависимости.

npm install --save-dev @babel/core @babel/preset-env

Читайте ещё по теме: