close
logologo
指南
配置
插件
API
社区
版本
更新日志
Rsbuild 0.x 文档
English
简体中文
指南
配置
插件
API
社区
更新日志
Rsbuild 0.x 文档
English
简体中文
logologo
Overview
root
mode
plugins
logLevel
environments

dev

dev.assetPrefix
dev.browserLogs
dev.cliShortcuts
dev.client
dev.hmr
dev.lazyCompilation
dev.liveReload
dev.progressBar
dev.setupMiddlewares
dev.watchFiles
dev.writeToDisk

resolve

resolve.aliasStrategy
resolve.alias
resolve.conditionNames
resolve.dedupe
resolve.extensions
resolve.mainFields

source

source.assetsInclude
source.decorators
source.define
source.entry
source.exclude
source.include
source.preEntry
source.transformImport
source.tsconfigPath

output

output.assetPrefix
output.charset
output.cleanDistPath
output.copy
output.cssModules
output.dataUriLimit
output.distPath
output.emitAssets
output.emitCss
output.externals
output.filenameHash
output.filename
output.injectStyles
output.inlineScripts
output.inlineStyles
output.legalComments
output.manifest
output.minify
output.module
output.overrideBrowserslist
output.polyfill
output.sourceMap
output.target

html

html.appIcon
html.crossorigin
html.favicon
html.inject
html.meta
html.mountId
html.outputStructure
html.scriptLoading
html.tags
html.templateParameters
html.template
html.title

server

server.base
server.compress
server.cors
server.headers
server.historyApiFallback
server.host
server.htmlFallback
server.https
server.middlewareMode
server.open
server.port
server.printUrls
server.proxy
server.publicDir
server.strictPort

security

security.nonce
security.sri

tools

tools.bundlerChain
tools.cssExtract
tools.cssLoader
tools.htmlPlugin
tools.lightningcssLoader
tools.postcss
tools.rspack
tools.styleLoader
tools.swc

performance

performance.buildCache
performance.bundleAnalyze
performance.chunkSplit
performance.dnsPrefetch
performance.preconnect
performance.prefetch
performance.preload
performance.printFileSize
performance.profile
performance.removeConsole
performance.removeMomentLocale

moduleFederation

moduleFederation.options
📝 在 GitHub 上编辑此页
上一页server.port
下一页server.proxy

#server.printUrls

  • 类型:
type Routes = Array<{
  entryName: string;
  pathname: string;
}>;

type PrintUrls =
  | boolean
  | ((params: {
      urls: string[];
      port: number;
      routes: Routes;
      protocol: string;
    }) => string[] | void);
  • 默认值: true

控制是否以及如何打印 server 的 URL 地址。

默认情况下,当你启动 dev server 或 preview server 后,Rsbuild 会输出以下日志信息:

  ➜ Local:    http://localhost:3000
  ➜ Network:  http://192.168.0.1:3000

#自定义日志

server.printUrls 可以设置为一个函数,函数的入参包括 port,protocol、urls 和 routes。

#修改 URL

如果 printUrls 函数返回了一组新的 URLs,那么 Rsbuild 将会把这组 URLs 按照默认格式输出到 terminal:

rsbuild.config.ts
export default {
  server: {
    printUrls({ urls }) {
      return urls.map((url) => `${url}/base/`);
    },
  },
};

输出为:

  ➜ Local:    http://localhost:3000/base/
  ➜ Network:  http://192.168.0.1:3000/base/

#完全自定义

如果 printUrls 函数没有返回值,Rsbuild 将不会输出 server 的 URL 地址,你可以基于入参来自定义日志内容,并自行输出到 terminal。

rsbuild.config.ts
export default {
  server: {
    printUrls({ urls, port, protocol }) {
      console.log(urls); // ['http://localhost:3000', 'http://192.168.0.1:3000']
      console.log(port); // 3000
      console.log(protocol); // 'http' or 'https'
    },
  },
};

#多页面输出

如果当前项目包含多个页面,你可以基于 routes 参数,为每个页面单独输出一份 URL。

比如项目包含 index 和 detail 两个页面时,routes 的内容如下:

rsbuild.config.ts
export default {
  server: {
    printUrls({ routes }) {
      /**
       * [
       *   { entryName: 'index', pathname: '/' },
       *   { entryName: 'detail', pathname: '/detail' }
       * ]
       */
      console.log(routes);
    },
  },
};

#禁用输出

将 server.printUrls 设置为 false,Rsbuild 将不会输出 server 的 URL 地址。

rsbuild.config.ts
export default {
  server: {
    printUrls: false,
  },
};

#禁用 HTML

当 tools.htmlPlugin 被设置为 false 时,Rsbuild 不会生成 HTML 文件,也不会输出 server 的 URL 地址。

但你仍然可以通过 server.printUrls 函数来输出 URL 地址,它具有更高的优先级。

rsbuild.config.ts
export default {
  tools: {
    htmlPlugin: false,
  },
  server: {
    printUrls: ({ port }) => [`http://localhost:${port}`],
  },
};

输出:

  ➜ Local:    http://localhost:3000