Как я могу поделиться кодом между Node.js и браузером?

Question

Я создаю небольшое приложение с клиентом JavaScript (запускается в браузере) и сервером Node.js, общение с помощью WebSocket.

Я хотел бы поделиться кодом между клиентом и сервером. Я только начал с Node.js, и мои знания современного JavaScript немного устарели, если не сказать больше. Так что я все еще думаю о функции CommonJS require (). Если я создаю свои пакеты с помощью объекта «export», я не вижу, как я могу использовать те же файлы JavaScript в браузере.

Я хочу создать набор методов и классов, которые используются на обоих концах для облегчения кодирования и декодирования сообщений и других зеркальных задач. Однако системы упаковки Node.js / CommonJS, по-видимому, не позволяют мне создавать файлы JavaScript, которые можно использовать с обеих сторон.

Я также пытался использовать JS.Class, чтобы получить более узкую модель OO, но я сдался, потому что не мог понять, как заставить предоставленные файлы JavaScript работать с require (). Я что-то упускаю здесь?

Answer 1

Напишите ваш код в виде RequireJS модулей и ваши тесты в виде Жасмин тесты.

Таким образом, код может быть загружен везде с помощью RequireJS, и тесты можно запускать в браузере с помощью jasmine-html и jasmine-node в Node.js без необходимости изменять код или тесты.

Вот рабочий пример для этого.

Answer 2

Если вы хотите написать свой браузер в стиле Node.js, вы можете попробовать dualify .

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

Answer 3

now.js также стоит посмотреть.Он позволяет вам вызывать серверную часть со стороны клиента, а клиентские функции - со стороны сервера

Answer 4

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

Проблема: вы не можете использовать window (не существует в Node.js) и global (не существует в браузере).

Решение:

• Файл config.js:

  var config = {
    foo: 'bar'
  };
  if (typeof module === 'object') module.exports = config;
  

• В браузере (index.html):

  <script src="config.js"></script>
  <script src="myApp.js"></script>
  

  Теперь вы можете открыть инструменты разработчика и получить доступ к глобальной переменной config

• В Node.js (app.js):

  const config = require('./config');
  console.log(config.foo); // Prints 'bar'
  

• С Babel или TypeScript:

  import config from './config';
  console.log(config.foo); // Prints 'bar'
  

Answer 5

Я написал это, его легко использовать, если вы хотите установить все переменные в глобальной области видимости:

(function(vars, global) {
    for (var i in vars) global[i] = vars[i];
})({
    abc: function() {
        ...
    },
    xyz: function() {
        ...
    }
}, typeof exports === "undefined" ? this : exports);