在角2应用程序不能改变基本文件夹精简版服务器

Question

我经历的5 minute quickstart of Angular 2。然而，我的应用程序驻留在src/文件夹，而不是在我的库的根，当我运行npm start的应用程序试图找到根的index.html文件。我对lite-server念起来文档显示，它使用BrowserSync，我可以在我的存储库中的BrowserSync重新bs-config.json。我这样做，这就是我的配置是这样的：

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

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

[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"
  }
};

然而，角程序仍在打开3000端口和它无视在配置中定义的基本目录。我究竟做错了什么？

Answer 1

因为精简版服务器尝试加载使用bs-config.js功能的模块，您应该使用一个名为bs-config.json（而不是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版）

还有在这种情况下两种选择：

• 港口
• BASEDIR

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

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

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

Answer 2

从Thierry Templier答案是不太正确的（再），您可以使用该bs-config.json或bs-config.js配置调整您的浏览器同步配置。这是我想出了最初与JIT（刚刚在时间）和AOT（名列前茅的时间）编译支持（angular2 quick start example）的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
    })
  ]
};