---
title: 管理应用入口​​​
---

上一个小节中，我们学习了使用命令行手动创建新的入口。

在这一小节中，我们将通过配置项来对入口进行管理。

我们可以在 `package.json` 中的 `modernConfig`，或是在符合[业界主流惯例](https://github.com/davidtheclark/cosmiconfig)的 Modern.js 配置文件里，自己写代码来控制项目的配置。

之前的章节中，我们都是直接修改 `package.json` 中的 `modernConfig` 字段来实现修改配置。

现在，让我们在项目目录下，新建一个 `modern.config.js`（若已新建可忽略），并在里面添加内容：

```js title="modern.config.js"
export default defineConfig({
  server: {
    ssr: true,
    ssrByEntries: {
      'landing-page': false,
    },
  },
};
```

执行 `pnpm run dev`，再用浏览器打开 `view-source:http://localhost:8080/landing-page`，可以看到 `landing-page` 网页内容是通过 js 动态加载的，且此页面的 SSR 功能被关闭。

注：此时，其他页面的 SSR 功能仍然正常开启。

如果注释掉 `ssrByEntries` 和它的值，landing-page 的 SSR 功能就恢复开启了。

:::info 注
当相同配置字段出现于两个文件中时， `package.json` 中 `modernConfig` 字段里的配置会优先于 `modern.config.js` 中的配置。
:::

当需要配置包含复杂逻辑的选项时，比如，开发者想在项目中使用 `*.myext` 文件，这是一种非主流的文件类型，Modern.js 没有默认集成对它的支持。

所以，开发者可以在 `modern.config.js` 里增加对它的支持（通过webpack配置），如下所示：

:::info 注
更多 webpack 配置相关可以查看 [Webpack 配置文档](/docs/apis/config/tools/webpack)。
:::

```js
// 注：以下为伪代码，loader等名字皆为虚构，仅做演示使用
export default defineConfig({
  tools: {
    webpack: (config, { chain }) => {
      chain.module
        .rule('loaders')
        .test(/\.myext$/)
        .use('custom-loader')
        .loader('myext-loader')
        .options({});
    },
  },
};
```

这个需求要修改 webpack 配置，用 Modern.js 配置的`tools.webpack`选项来实现显然是更方便的。

还有一些时候，需要一些更复杂的逻辑来做设置，比如需要 JS 变量、表达式、导入模块等，这种时候也适合用 `modern.config.js` 来手动配置，比如：

```js
export default defineConfig({
  server: {
    ssrByEntries: {
      'landing-page': process.env.NODE_ENV !== 'production',
    },
  },
};
```

以上代码实现表示只在开发环境里开启 SSR。