Как подключить node js к проекту
Перейти к содержимому

Как подключить node js к проекту

  • автор:

Создание нового проекта Node.js и работа с зависимостями

Ускоряйте разработку приложений Node.js, используя зависимости из реестра npm. Узнайте, как управлять зависимостями для проекта. В этом модуле используется JavaScript CommonJS в среде выполнения Node.js.

Цели обучения

К концу этого модуля вы сможете:

  • инициализировать проекты Node.js;
  • Понимание, из чего состоит файл манифеста package.json и как его использовать.
  • добавлять пакеты в проект Node.js и удалять их из проекта;
  • управлять зависимостями пакетов и обновлять их предсказуемым образом.

Предварительные требования

  • На компьютере должны быть установлены Git и Node.js.
  • Знакомство с редактированием текста и файлов кода в любом текстовом редакторе.

Как подключить javascript-файл к проекту на NodeJS?

Я создал calc.js с помощью Jjon.js (генератор парсеров), т.о. получил компилятор простейшего калькулятор-языка. Для того, чтобы парсер заработал, надо в терминале запустить файл calc_run.js через NodeJS. Код запускного файла-примера calc_run.js очень простой, две строки. Код работает (ответ =3), если в терминале ввести: node calc_run.js

var parser = require('./calc.js'); console.log(parser.parse('1+2'));

И вот теперь я хочу сделать тоже самое, но через полноценный NodeJS в браузере. Я завел файл server.js с настройками

var http = require('http'), fs = require('fs'); fs.readFile('./calc.html', function (err, html) < if (err) < throw err; >http.createServer(function(request, response) < response.writeHeader(200, ); response.write(html); response.end(); >).listen(8000); >);

я завел calc.html файл с простой структурой

    Document  

hello

Сервер стартует на порте 8000, hello выводится, но не могу подключить скрипт calc_run.js Не срабатывает даже вставка текста скриптов calc.js + calc_run.js в документ calc.html А очень хочется, чтобы пример работал не в консоли, а на сервере. Как я понял вставка js-кода в html-документ в NodeJS происходит как-то сложно, через пути, через создание переменных для сервера и проч. Но информации об этом найти не могу (или плохо ищу). Кто подскажет как вставить calc_run.js в документ calc.html, чтобы пример сработал и парсер выдал ответ из-под рабочего сервера под NodeJS?

  • Вопрос задан более трёх лет назад
  • 2151 просмотр

Настройка проекта Node с помощью Typescript

Настройка проекта Node с помощью Typescript

Node — это среда исполнения, позволяющая писать серверный код JavaScript. Она получила очень широкое распространение после своего выпуска в 2011 году. С ростом базы кода написание серверного кода JavaScript может представлять сложности в связи с характером языка JavaScript: динамичным и слабо типизированным.

Разработчики, переходящие на JavaScript с других языков, часто жалуются на отсутствие мощного статического типирования, но TypeScript позволяет устранить этот недостаток.

TypeScript — это типовой (опциональный) супернабор JavaScript, который может помочь со сборкой и управлением крупномасштабными проектами JavaScript. Его можно представить как JavaScript с дополнительными возможностями, включая мощное статическое типирование, компиляцию и объектно-ориентированное программирование.

Примечание. С технической точки зрения TypeScript является супернабором JavaScript, и это означает, что весь код JavaScript является корректным кодом TypeScript.

Перечислим некоторые преимущества использования TypeScript:

  1. Опциональная статическая типизация.
  2. Логическая обработка типов.
  3. Возможность использования интерфейсов.

В этом учебном модуле вы настроите проект Node с помощью TypeScript. Вы создадите приложение Express с помощью TypeScript и преобразуете его в компактный и надежный код JavaScript.

Предварительные требования

Перед началом прохождения этого модуля вам нужно будет установить Node.js на вашем компьютере. Для этого можно выполнить указания руководства Установка Node.js и создание локальной среды разработки для вашей операционной системы.

Шаг 1 — Инициализация проекта npm

Для начала создайте новую папку с именем node_project и перейдите в этот каталог.

Затем инициализируйте его как проект npm:

После запуска npm init вам нужно будет передать npm информацию о вашем проекте. Если вы разрешите npm принимать ощутимые значения по умолчанию, вы можете добавить флаг y , чтобы пропустить диалоги с запросом дополнительной информации:

Теперь пространство вашего проекта настроено, и вы можете перейти к установке необходимых зависимостей.

Шаг 2 — Установка зависимостей

Следующий шаг после инициализации базового проекта npm — установить зависимости, требующиеся для запуска TypeScript.

Запустите следующие команды из каталога вашего проекта для установки зависимостей:

Флаг -D — сокращенное обозначение опции: —save-dev . Более подробную информацию об этом флаге можно найти в документации npmjs.

Пришло время установить платформу Express:

Вторая команда устанавливает типы Express для поддержки TypeScript. Типы в TypeScript — это файлы, которые обычно имеют расширение .d.ts . Файлы используются для предоставления типовой информации об API, в данном случае структуры Express.

Этот пакет требуется, потому что TypeScript и Express являются независимыми пакетами. Без пакета @types/express у TypeScript нет способа узнавать типы классов Express.

Шаг 3 — Настройка TypeScript

В этом разделе мы настроим TypeScript и проверку соблюдения стандартов для TypeScript. TypeScript использует файл tsconfig.json для настройки опций компилятора для проекта. Создайте файл tsconfig.json в корне каталога проекта и вставьте следующий фрагмент кода:

tsconfig.json

 "compilerOptions":  "module": "commonjs", "esModuleInterop": true, "target": "es6", "moduleResolution": "node", "sourceMap": true, "outDir": "dist" >, "lib": ["es2015"] > 

Давайте рассмотрим некоторые ключи во фрагменте кода JSON выше:

  • module : указывает метод генерирования кода модуля. Node использует commonjs .
  • target : указывает уровень языка на выходе.
  • moduleResolution : помогает компилятору определить, на что ссылается импорт. Значение node имитирует механизм разрешения модуля Node.
  • outDir : Это место для вывода файлов .js после транспиляции. В этом учебном модуле мы сохраним его как dist .

В качестве альтернативы созданию и заполнения файла tsconfig.json вручную можно запустить следующую команду:

Эта команда сгенерирует файл tsconfig.json с правильными комментариями.

Чтобы узнать больше о доступных опциях ключ-значение, можно использовать официальную документацию TypeScript, где приводятся разъяснения всех опций.

Теперь вы можете настроить проверку соответствия стандартам кода TypeScript для этого проекта. Откройте в терминале корневой каталог вашего проекта, который установлен в этом учебном модуле как node_project , и запустите следующую команду для генерирования файла tslint.json :

Откройте сгенерированный файл tslint.json и добавьте соответствующее правило no-console :

tslint.json

 "defaultSeverity": "error", "extends": ["tslint:recommended"], "jsRules": >, "rules":  "no-console": false >, "rulesDirectory": [] > 

По умолчанию модуль проверки TypeScript предотвращает использование отладки через команды консоли , поэтому нужно явно предписать ему отключить правило по умолчанию no-console .

Шаг 4 — Обновление файла package.json

Сейчас вы можете запускать функции в терминале по отдельности или создать скрипт npm для их запуска.

На этом шаге мы создадим скрипт start , который выполнит компиляцию и транспиляцию кода TypeScript, а затем запустит полученное приложение .js .

Откройте файл package.json и обновите его соответствующим образом:

package.json

 "name": "node-with-ts", "version": "1.0.0", "description": "", "main": "dist/app.js", "scripts":  "start": "tsc && node dist/app.js", "test": "echo \"Error: no test specified\" && exit 1" >, "author": "", "license": "ISC", "devDependencies":  "@types/express": "^4.16.1", "tslint": "^5.12.1", "typescript": "^3.3.3" >, "dependencies":  "express": "^4.16.4" > > 

В приведенном выше фрагменте кода мы обновили путь main и добавили команду start в раздел scripts. Если посмотреть на команду start , вы увидите, что вначале запускается команда tsc , а затем — команда node . При этом будет проведена компиляция, и сгенерированный вывод будет запущен с помощью node .

Команда tsc предписывает TypeScript скомпилировать приложение и поместить сгенерированный вывод .js в указанном каталоге outDir , как указано в файле tsconfig.json .

Шаг 5 — Создание и запуск базового сервера Express

Теперь TypeScript и модуль проверки настроены, и мы можем приступить к сборке модуля Node Express Server.

Вначале создайте папку src в корневом каталоге вашего проекта:

Затем создайте файл с именем app.ts :

На этом этапе структура каталогов должна выглядеть следующим образом:

├── node_modules/ ├── src/ ├── app.ts ├── package-lock.json ├── package.json ├── tsconfig.json ├── tslint.json 

Откройте файл app.ts в предпочитаемом текстовом редакторе и вставьте следующий фрагмент кода:

import express from 'express'; const app = express(); const port = 3000; app.get('/', (req, res) =>  res.send('The sedulous hyena ate the antelope!'); >); app.listen(port, err =>  if (err)  return console.error(err); > return console.log(`server is listening on $port>`); >); 

Приведенный выше код создает сервер Node, прослушивающий порт 3000 на предмет запросов. Запустите приложение с помощью следующей команды:

При успешном выполнении сообщение будет зарегистрировано на терминале:

Теперь вы можете открыть в браузере адрес http://localhost:3000 и увидите следующее сообщение:

Окно браузера с сообщением: Усердная гиена съела антилопу!

Откройте файл dist/app.js , и вы найдете в нем транспилированную версию кода TypeScript:

"use strict"; var __importDefault = (this && this.__importDefault) || function (mod)  return (mod && mod.__esModule) ? mod :  "default": mod >; >; Object.defineProperty(exports, "__esModule",  value: true >); const express_1 = __importDefault(require("express")); const app = express_1.default(); const port = 3000; app.get('/', (req, res) =>  res.send('The sedulous hyena ate the antelope!'); >); app.listen(port, err =>  if (err)  return console.error(err); > return console.log(`server is listening on $port>`); >); //# sourceMappingURL=app.js.map 

Вы успешно настроили проект Node для использования TypeScript.

Заключение

В этом учебном модуле вы узнали, почему TypeScript полезен для написания надежного кода JavaScript. Также вы узнали о некоторых преимуществах работы с TypeScript.

Наконец, вы настроили проект Node с использованием структуры Express, но скомпилировали и запустили проект с помощью TypeScript.

Thanks for learning with the DigitalOcean Community. Check out our offerings for compute, storage, networking, and managed databases.

Начало работы с Node.js

Мы начнем с основ: никаких предварительных знаний Node.js не требуется. Цель этой книги — начать работу с Node.js и убедиться, что вы понимаете, как писать приложение с использованием этой платформы.

В первой главе вы узнаете, что такое Node.js, как установить её на свой компьютер и как начать с ней работать — так что в следующих главах можно будет приступить к реальной разработке. Приступим!

Node.js в двух словах

Node.js — это среда выполнения JavaScript, построенная на JavaScript-движке V8 из Chrome. В основе Node.js лежит событийно-управляемая модель с неблокирующими операциями I/O, что делает её легкой и эффективной.

Другими словами: Node.js предлагает вам возможность писать невероятно производительный серверный код с использованием JavaScript. Как говорится в официальном описании: Node.js — это среда выполнения, использующая тот же JavaScript-движок V8, который вы можете найти в браузере Google Chrome. Но этого недостаточно для успеха Node.js. В Node.js используется libuv — кросс-платформенная библиотека поддержки с акцентом на асинхронный ввод-вывод.

С точки зрения разработчика, Node.js однопоточна, но под капотом libuv использует треды, события файловой системы, реализует цикл событий, включает в себя тред-пулинг и так далее. В большинстве случаев вы не будете взаимодействовать с libuv напрямую.

Установка Node.js для старта

Последнюю версию Node.js вы можете найти на официальном сайте: https://nodejs.org/en/download/.

При таком подходе довольно легко начать работу, но если позже вы захотите добавить в систему больше версий Node.js, лучше начать использовать nvm (node version manager) — диспетчер версий Node.js.

После его установки вы сможете использовать очень простой CLI API для смены версии Node.js:

Установка различных версий Node.js

nvm install 4.4

Затем, если вы хотите проверить в работе экспериментальную версию:

nvm install 5

Чтобы убедиться, что у вас установлена и запущена Node.js, выполните:

node --version

Если все в порядке, эта команда вернет номер версии текущего активного бинарного файла Node.js.

Использование нескольких версий Node.js

Если вы работаете над проектом, поддерживающим Node.js v4, вы можете начать использовать эту версию с помощью следующей команды:

nvm use 4

Затем вы можете переключиться на Node.js v5 с помощью той же самой команды:

nvm use 5

Хорошо, теперь мы знаем, как устанавливать Node.js и переключаться между её версиями, но в чём смысл?

С тех пор как был сформирован Node.js Foundation, Node.js имеет план релизов. Это очень похоже на другие проекты Linux Foundation. Это означает, что есть два релиза: стабильный и экспериментальный. В Node.js стабильными версиями с долговременной поддержкой (LTS) являются те, которые начинаются с четных чисел (4, 6, 8, …). Экспериментальные версии нумеруются нечетными числами (5, 7, …).

Мы рекомендуем использовать версию LTS в продакшене и пробовать новые возможности с экспериментальной версией.

Если вы используете Windows, здесь можно скачать альтернативу для nvm: nvm-windows.

Hello World

Чтобы начать работу с Node.js, давайте попробуем её в консоли! Запустите Node.js, просто набрав node :

$ node
>

Хорошо, давайте попробуем что-то напечатать:

$ node
> console.log('hello from Node.js')

После нажатия Enter вы получите следующее:

> console.log('hello from Node.js')
hello from Node.js
undefined

Не стесняйтесь играть с Node.js с помощью этого интерфейса: я обычно тестирую небольшие фрагменты кода здесь, если я не хочу помещать их в файл.

Пришло время создать наше приложение Hello Node.js!

Начнем с создания файла index.js . Откройте свою IDE (Atom, Sublime, Code — выбор за вами), создайте новый файл и сохраните его с именем index.js . Если вы закончили, скопируйте в него следующий фрагмент кода:

// index.js
console.log('hello from Node.js')

Чтобы запустить этот файл, вы должны снова открыть свой терминал и перейти в каталог, в котором размещён index.js .

Как только вы успешно переместитесь в нужное место, запустите файл, используя команду node index.js . Вы увидите, что эта команда будет выдавать тот же результат, что и раньше, выводя строку непосредственно в терминале.

Модульность для вашего приложения

Теперь у вас есть файл index.js , поэтому пришло время перейти на следующий уровень! Давайте создадим что-то более сложное, разделив наш исходный код на несколько JavaScript-файлов с целью удобочитаемости и поддерживаемости. Чтобы начать работу, вернитесь в свою IDE и создайте следующую структуру каталогов (с пустыми файлами), но пока не трогайте package.json , мы сгенерируем его автоматически на следующем шаге:

├── app
| ├── calc.js
| └── index.js
├── index.js
└── package.json

Каждый проект Node.js начинается с создания файла package.json . Вы можете думать о нем как о JSON-представлении приложения и его зависимостей. Он содержит имя вашего приложения, автора (вас) и все зависимости, необходимые для запуска приложения. Мы рассмотрим раздел зависимостей позже в главе «Использование NPM».

Вы можете интерактивно генерировать файл package.json с помощью команды npm init в терминале. После запуска команды вас попросят ввести некоторые данные, например имя вашего приложения, версию, описание и так далее. Не нужно беспокоиться, просто нажимайте Enter, пока не получите сформированный JSON и вопрос is it ok? . Нажмите Enter в последний раз и вуаля: ваш package.json был автоматически сгенерирован и помещен в папку вашего приложения. Если вы откроете этот файл в своей IDE, он будет очень похож на фрагмент кода ниже.

// package.json
"name": "@risingstack/node-hero",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": "test": "echo \"Error: no test specified\" && exit 1",
"start": "node index.js"
>,
"author": "", "license": "ISC"
>

Хорошей практикой является добавление стартового скрипта в ваш пакет package.json . Как только вы это сделаете, как показано в примере выше, вы можете запустить приложение с помощью команды npm start . Это очень удобно, когда вы хотите развернуть свое приложение у PaaS-провайдера: они могут распознать команду start и использовать её для запуска приложения.

Теперь давайте вернемся к первому созданному вами файлу под названием index.js . Я рекомендую оставить этот файл очень компактным: только подключение самого приложения (файл index.js из подкаталога /app , созданного ранее). Скопируйте следующий код в свой файл index.js и сохраните:

// index.js
require('./app/index')

Теперь пришло время приступить к созданию реального приложения. Откройте файл index.js из папки /app , чтобы создать очень простой пример: добавление массива чисел. В этом случае файл index.js будет содержать только числа, которые мы хотим добавить, а логика, требующая вычислений, должна быть помещена в отдельный модуль.

Вставьте этот код в файл index.js в каталоге /app .

// app/index.js
const calc = require('./calc')
const numbersToAdd = [
3,
4,
10,
2
]
const result = calc.sum(numbersToAdd)
console.log(`The result is: $`)

Теперь вставьте фактическую бизнес-логику в файл calc.js , который можно найти в той же папке.

// app/calc.js
function sum (arr) return arr.reduce(function(a, b) return a + b
>, 0)
>
module.exports.sum = sum

Чтобы проверить, всё ли вы сделали правильно, сохраните эти файлы, откройте терминал и введите npm start или node index.js . Если вы все сделали правильно, вы получите ответ: 19. Если что-то пошло не так, внимательно просмотрите лог в консоли и найдите проблему на его основе.

В следующей главе под названием «Использование NPM» мы рассмотрим, как использовать NPM — менеджер пакетов для JavaScript.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *