logo
  • 指南
  • 配置
  • 插件
  • API
  • 示例
  • 社区
  • Modern.js 2.x 文档
  • 简体中文
    • 简体中文
    • English
    • 配置使用
      dev
      assetPrefix
      beforeStartUrl
      client
      hmr
      host
      https
      lazyCompilation
      liveReload
      port
      progressBar
      setupMiddlewares
      startUrl
      watchFiles
      writeToDisk
      bff
      prefix
      html
      appIcon
      crossorigin
      favicon
      inject
      meta
      mountId
      outputStructure
      scriptLoading
      tags
      templateParameters
      template
      title
      tools
      autoprefixer
      babel
      bundlerChain
      cssExtract
      cssLoader
      devServer
      htmlPlugin
      less
      lightningcssLoader
      minifyCss
      postcss
      rspack
      sass
      styleLoader
      swc
      tsChecker
      source
      aliasStrategy
      alias
      configDir
      decorators
      define
      disableDefaultEntries
      enableAsyncEntry
      entriesDir
      entries
      exclude
      globalVars
      include
      mainEntryName
      preEntry
      transformImport
      resolve
      aliasStrategy
      alias
      conditionNames
      dedupe
      extensions
      server
      baseUrl
      port
      publicRoutes
      routes
      ssrByEntries
      ssr
      output
      assetPrefix
      assetsRetry
      charset
      cleanDistPath
      convertToRem
      copy
      cssModules
      dataUriLimit
      disableCssModuleExtension
      disableInlineRuntimeChunk
      disableSvgr
      disableTsChecker
      distPath
      enableAssetManifest
      enableCssModuleTSDeclaration
      disableInlineRouteManifests
      externals
      filenameHash
      filename
      injectStyles
      inlineScripts
      inlineStyles
      legalComments
      minify
      overrideBrowserslist
      polyfill
      sourceMap
      splitRouteChunks
      ssg
      ssgByEntries
      svgDefaultExport
      tempDir
      plugins
      security
      checkSyntax
      nonce
      sri
      runtime
      介绍
      plugins
      router
      performance
      buildCache
      bundleAnalyze
      chunkSplit
      dnsPrefetch
      preconnect
      prefetch
      preload
      printFileSize
      profile
      removeConsole
      removeMomentLocale
      experiments
      sourceBuild
      builderPlugins
      📝 编辑此页面
      上一页plugins下一页nonce

      #security.checkSyntax

      • 类型:
      type CheckSyntax =
        | boolean
        | {
            targets?: string[];
            exclude?: RegExp | RegExp[];
            ecmaVersion?: EcmaVersion;
          };
      • 默认值: false

      用于分析构建产物中是否存在当前浏览器范围下不兼容的高级语法。如果存在,会将详细信息打印在终端。

      #启用检测

      你可以将 checkSyntax 设置为 true 来启用语法检测。

      export default {
        security: {
          checkSyntax: true,
        },
      };

      当你开启 checkSyntax 后,Modern.js 会在生产环境构建时进行检测,当在构建产物中检测到不兼容的高级语法后,会将错误日志打印在终端,并退出当前构建流程。

      #错误日志

      错误日志的格式如下所示,包含代码来源文件、产物位置、错误原因、源代码等信息:

      error   [Syntax Checker] Find some syntax errors after production build:
      
        Error 1
        source:  /node_modules/foo/index.js:1:0
        output:  /dist/static/js/main.3f7a4d7e.js:2:39400
        reason:  Unexpected token (1:178)
        code:
           9 |
          10 | var b = 2;
          11 |
        > 12 | console.log(() => {
          13 |   return a + b;
          14 | });
          15 |
      Tip

      目前语法检测是基于 AST parser 来实现的,每次检测时,只能找出文件中的第一个不兼容语法。如果一个文件中存在多个不兼容语法,你需要修复已发现的语法,并重新执行检测。 如果日志中没有显示对应的源码位置,可以尝试将 output.minify 设置为 false 后再重新构建。

      #解决方法

      当检测到语法错误后,你可以通过以下方式来处理:

      • 如果你希望降级该语法,以保证代码具备良好的兼容性,可以通过 source.include 配置来编译相应的模块。
      • 如果你不希望降级该语法,可以调整项目的 browserslist 范围,调整至与该语法相匹配的范围。
      • 如果你不希望对某些产物进行语法检查,可用 checkSyntax.exclude 配置排除要检查的文件。

      #选项

      security.checkSyntax 底层基于 @rsbuild/plugin-check-syntax 实现,具体选项可参考 @rsbuild/plugin-check-syntax。