Невозможно изменить базовую папку для Lite-сервера в приложении Angular 2

Я прохожу через 5-минутный быстрый старт Angular 2. Однако мое приложение находится в папке src/ вместо корня моего репозитория, а при запуске npm start приложение пытается найти файл index.html в корне. Я прочитал на lite-server, и документация показывает, что он использует BrowserSync, и я могу перенастроить BrowserSync с bs-config.json в моем репозитории. Я сделал это, и вот что выглядит моя конфигурация:

{
  "port": 8123,
  "server": { "baseDir": "./src" }
}

В соответствии с журналом, используя указанный config:

[1] > [email protected] lite E:\GitHub\todo-app-angular2
[1] > lite-server "./bs-config.json"

Я также попробовал переопределить через bs-config.js

module.exports = {
  port: 8123,
  server: {
    baseDir: "./src"
  }
};

Однако приложение Angular все еще открыто на порту 3000, и оно игнорирует baseDir, определенный в конфиге. Что я делаю неправильно?

Ответ 1

Вы должны использовать файл с именем bs-config.js (вместо bs-config.json), так как lite-server пытается загрузить модуль с помощью функции require. Конфигурация должна быть допустимым модулем Node:

module.exports = {
  "port": 8123,
  "server": { "baseDir": "./src" }
};

См. эту строку в исходном коде: https://github.com/johnpapa/lite-server/blob/master/lib/lite-server.js#L20.

Этот файл по умолчанию загружается из папки проекта пользователя.

Edit

После копания немного больше, первая часть моего ответа основана на коде из github, но не на самом деле, установленном с помощью npm install (версия 1.3.4)

В этом случае есть два варианта:

  • порт
  • BASEDIR

Использование этой команды устранит вашу проблему:

$ lite-server --baseDir ./src --port 3333

Надеюсь, это поможет вам, Thierry

Ответ 2

Ответ от Thierry Templier не совсем корректный (больше), вы можете использовать конфигурацию bs-config.json или bs-config.js для настройки конфигурации синхронизации с браузером. Это то, что я первоначально придумал для angular2 пример быстрого запуска с JIT (Just-In-Time) и AOT (Впереди -Time) поддержка компиляции (bs-config.json)

{
  "port": 8000,
  "server": ["app", "."]
}

для размещения проекта из нескольких каталогов.

Однако мне не понравилось это решение, потому что, перезаписав раздел server в файле json, конфигурация по умолчанию middleware была перезаписана в одно и то же время.

Поэтому я закончил следующий подход: я взял файлы lite-server config-defaults.js и изменил его (bs-config.js):

'use strict';
var fallback = require('connect-history-api-fallback');
var log = require('connect-logger');
/*
 | For up-to-date information about the options:
 |   http://www.browsersync.io/docs/options/
 */
module.exports = {
  port: 8000,
  injectChanges: false, // workaround for Angular 2 styleUrls loading
  filters: ['./**/*.{html,htm,css,js}'],
  watchOptions: {
    ignored: 'node_modules'
  },
  server: ['./', 'app'],
  middleware: [
    log({ format: '%date %status %method %url' }),
    fallback({
        index: '/index.html',
        htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'] // systemjs workaround
    })
  ]
};