介绍NX的QWIK集成
#javascript #qwik #tooling #nx

介绍

虽然Qwik框架本身自信地延续了V1,但感觉就像是一个正确的时间,为其引入NX插件,该插件名为qwik-nx。该插件提供的主要功能是在符合其他NX应用程序标准的NX Workspace中的QWIK应用程序的生成和执行。
由于Qwik本身使用Vite作为构建工具,因此该NX插件利用全新的@nrwl/vite软件包的功能来构建和运行您的QWIK应用程序。

入门

为了入门而要做的第一件事是生成一个NX工作区。 qwik-nx插件是第一个使用NX自定义交互式预设的插件之一,因此您需要做的就是简单地运行npx create-nx-workspace@latest --preset=qwik-nx。首先,您将提示您提示通用问题,例如要使用的工作空间名称以及是否启用NX Cloud,并且在简短的初始化之后,它将继续进行QWIK特定问题。

Installation process

完成后,您最终将使用带有Qwik City的QWIK应用程序和所有相关依赖项的QWIK应用程序。

Structure of the workspace

在这一点上,只能使用Qwik City创建一个基本应用,但我们计划包括标准Qwik CLI提供的所有其他启动器。

创建新应用程序,库和组件

设置工作空间后,我们将访问qwik-nx插件已准备好的一堆整洁的发电机。强烈建议将NX控制台插件用于VS CodeWebstorm,因为它们可以完美地可视化所有配置选项和干燥运行的实际更改。

生成新应用

在VS Code的NX控制台中,单击generate => qwik-nx - application您将看到以下选项
qwik-nx:application generator options

另外,您可以在上面的屏幕截图上使用相同的选项运行npx nx generate qwik-nx:application <name>。随着所有内容,我们最终将获得与初始化过程中创建的应用程序完全相同的应用程序。

尾风周围也有很多兴奋,因此值得一提的是,有可能在使用tailwind选项创建的应用程序中包含尾风配置。如果您没有这样做,则可以随时运行npx nx generate qwik-nx:setup-tailwind –project=<application name>

产生液气

qwik-nx:library发电机构建在标准的NX库生成器上,因此它可以从中做到很多:NX LIBS与Qwik特定的nx libs一起使用。

qwik-nx:library generator options

生成组件

qwik-nx插件还提供了Qwikly(您得到的,对吗?)脚手架的功能。您所要做的就是运行qwik-nx:component Generator并选择要放入新组件的项目。根据下面的屏幕截图所示的选项,它也可以高度配置。

qwik-nx:component generator options

到目前为止,还没有“路由”发电机,但希望很快看到它。

运行和构建代码

qwik-nx插件用NX Generator代替了构建,服务和测试命令的直接调用,以一致且可预测的方式标准化这些任务。插件依赖于@nrwl/vite软件包提供的执行者。这里是QWIK应用程序可用的命令列表:

  • serve-使用@nrwl/vite:dev-server执行程序在开发模式下运行该应用
  • build-使用@nrwl/vite:build执行程序为客户端应用程序生成捆绑
  • build-ssr-还使用@nrwl/vite:build执行程序来生成Vite Preview Server所需的代码
  • preview-在上面结束构建命令,以运行模拟生产模式https://qwik.builder.io/docs/getting-started/#running-in-production的应用程序
  • test-使用依赖vitest
  • @nrwl/vite:test执行人
  • lint-只是常规的@nrwl/linter:eslint执行人

包起来

nx本身是一个很棒的工具,具有出色的功能,可以在存储库中使用一个或多个应用程序以分布式方式管理代码。借助qwik-nx插件,QWIK应用程序和库可以无缝地适合NX MonorePo,从而使开发人员更容易实现其目标。
QWIK框架专注于速度和性能,有望成为Web开发中的下一个革命性解决方案。随着我们的前进,qwik-nx插件将发展并变得更加能力和功能丰富,就像Qwik本身一样。

需要帮忙?

在Valor Software,我们热衷于保持技术的最前沿,并与Qwik,Builder.io的创建者进行集成合作伙伴。如果您对项目有任何疑问或需要帮助,请随时通过sales@valor-software.com与我们联系。