返回博客首页
← 所有文章

NativeScript CLI 6.0 更新:捆绑工作流、仅限 Webpack 以及默认启用 HMR

2019 年 7 月 25 日 — 作者:Stanimira Vlaeva

NativeScript 6.0 现在仅支持 Webpack!NativeScript CLI 现在依赖 Webpack 来构建您的应用程序代码。

之前

在 6.0 版本之前,NativeScript 支持两种构建项目的方式

  • tns build - 传统工作流,它会复制源代码目录 ("src/") 的全部内容;

  • tns build --bundle - 捆绑工作流,它依赖 Webpack 将源代码目录 ("src/") 捆绑成几个输出文件。

捆绑工作流可以通过 bundle 标志使用。您不仅可以在构建时使用它,还可以在开发过程中使用它。

tns run --bundle
tns preview --bundle
tns debug --bundle
tns test --bundle

捆绑工作流还使用 hmr 标志支持热模块替换。

tns run --bundle --hmr

仅限 Webpack

从 6.0 版本开始,NativeScript CLI 将**仅支持使用 Webpack 的捆绑工作流**。传统工作流不再可用。所有构建应用程序代码的 CLI 命令现在都使用捆绑工作流。

tns build
tns run
tns preview
tns prepare
tns debug
tns test

bundle 标志

您仍然可以为以上任何命令提供 bundle 标志。它不会以任何方式改变其行为。但是,您无法关闭 bundle 标志,并且**无法禁用捆绑工作流**。

sync-all-files 标志

sync-all-files 标志不再可用。提供它曾经会启用监视 node_modules 目录中的更改并在开发过程中同步它。使用捆绑工作流,这会自动处理。文件监视的工作流是

  1. Webpack 监视源代码中已引用的所有文件,无论其位置(应用程序或 node_modules);

  2. NativeScript CLI 为原生文件启动自己的监视程序

    • 来自 App_Resources 的文件
    • nativescript 插件的 platforms 目录
    • nativescript 插件的 package.json 文件
  3. NativeScript CLI 还会监视应用程序 package.json 文件(my-project/package.jsonmy-project/app/package-json)。

默认启用热模块替换

热模块替换现在已默认启用。以下命令现在可以使用 HMR

tns run
tns preview
tns debug [android|ios]

您可以使用 no-hmr 标志禁用热模块替换。

tns run --no-hmr
tns preview --no-hmr
tns debug [android|ios] --no-hmr

NativeScript 团队强烈建议在应用程序开发过程中使用热模块替换。HMR 可以显著减少更改之间的重新加载时间,并改善您的开发体验。

有关 NativeScript 中 HMR 的更多信息,请查看"深入探讨" 博客文章系列

在生产模式下构建

Webpack 有两种编译模式 - 开发和生产。默认模式是开发模式。

在 NativeScript 6.0 之前,提供 env.uglify 标志用于启用生产模式。

# Webpack builds in production mode
tns build --bundle --env.uglify

在 NativeScript 6.0 中,提供 release 标志会启用生产模式。env.uglify 标志不再更改编译模式。它仅告诉 Webpack 使用 TerserPlugin 最小化捆绑包。

# Webpack builds in production mode
tns build --release --keyStorePath ~/my.keystore --keyStorePassword myPass --keyStoreAlias myAlias --keyStoreAliasPassword myAliasPass

# Webpack builds in development mode
tns build --bundle --env.uglify

nativescript-dev-webpack 1.0

nativescript-dev-webpack 是包含所有与 Webpack 相关的构建逻辑的包。每个 NativeScript 6.0 项目都需要依赖该包,该包现在拥有其**第一个稳定版本 - 1.0**!

钩子

nativescript-dev-webpack 包使用钩子插入 NativeScript CLI 构建。将 CLI 迁移到捆绑工作流需要更改钩子 API。其中一些对于 NativeScript 插件来说可能是破坏性的。有关更多信息,请查看有关将 CLI 钩子迁移到 NativeScript 6.0的博客文章。