9

我正在完成Angular 2 的 5 分钟快速入门。但是,我的应用程序驻留在src/文件夹而不是存储库的根目录中,并且当我运行npm start应用程序时,它试图index.html在根目录中查找文件。我阅读lite-server并且文档显示它使用BrowserSync并且我可以在我的存储库中重新BrowserSync配置。bs-config.json我这样做了,这就是我的配置:

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

根据日志它使用指定的配置:

[1] > todo-app-angular2@1.0.0 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。我究竟做错了什么?

4

2 回答 2

17

您应该使用一个名为bs-config.js(而不是bs-config.json一个)的文件,因为 lite-server 尝试使用该require函数加载模块。配置应该是一个有效的节点模块:

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

请参阅源代码中的这一行:https ://github.com/johnpapa/lite-server/blob/master/lib/lite-server.js#L20 。

默认情况下,此文件是从用户的项目文件夹中加载的。

编辑

在深入挖掘之后,我的答案的第一部分依赖于来自 github 的代码,而不是实际安装的代码npm install(版本 1.3.4)

在这种情况下有两种选择:

  • 港口
  • 基础目录

使用此命令将解决您的问题:

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

希望它可以帮助你,蒂埃里

于 2016-02-02T09:37:27.310 回答
5

答案Thierry Templier并不完全正确(不再),您可以使用bs-config.jsonorbs-config.js配置来调整您的浏览器同步配置。这是我最初为angular2 快速入门示例提出的,它具有 JIT(Just-In-Time) 和 AOT(Ahead-Of-Time) 编译支持 ( bs-config.json)

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

从多个目录托管项目。

但是,我不喜欢这种解决方案,因为通过覆盖文件server中的部分,同时覆盖json了默认middleware配置。

因此,我以以下方法结束,我采用了默认的lite -serverconfig-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
    })
  ]
};
于 2016-12-15T16:32:37.970 回答