这个@wordpress/脚本包，通常称为wp-脚本是一组配置文件和脚本，主要用于标准化和简化需要JavaScript构建步骤的WordPress项目的开发过程。
JavaScript构建步骤是指将JavaScript源代码和相关资产转换、绑定和优化为适合生产环境的格式的过程。这些构建步骤通常采用现代JavaScript（ESNext和JSX），并将其转换为与大多数浏览器兼容的版本。他们还可以将多个文件绑定到一个文件中，缩小代码以减小文件大小，并执行各种其他任务以优化代码。
在为块编辑器构建时，通常会使用ESNext和JSX，而块编辑器手册中的所有示例都是用这些语法编写的。学习如何设置构建步骤至关重要。然而，配置必要的工具，如网络包,巴别塔，以及ESLint公司可能会变得复杂。这里就是wp-脚本进来了。
这里有一些事情wp脚本可以做到：
- 编制：使用Babel将现代JavaScript（ESNext和JSX）转换为与大多数浏览器兼容的代码。
- 捆绑：使用webpack将多个JavaScript文件合并到单个捆绑包中，以获得更好的性能。
- 代码忽略：为ESLint提供配置，以帮助确保代码质量和符合编码标准。
- 代码格式：将Prettier用于自动代码样式化，以在项目间保持一致的代码格式。
- Sass编译：将Sass（.scss或.Sass）文件转换为标准CSS。
- 代码缩小：减少用于生产的JavaScript代码的大小，以确保更快的页面加载。
该包抽象了许多与现代WordPress的JavaScript开发相关的初始设置、配置和样板代码。然后可以将重点放在构建基块和块编辑器扩展上。
如果您使用@wordpress/创建块包来构建创建和注册块所需的文件结构，您还可以获得现代JavaScript构建设置（使用wp-脚本)无需配置，因此您无需担心安装wp-脚本或将资产排队。请参阅开始使用创建块了解更多详细信息。
确保您拥有Node.js和净现值法安装在您的计算机上。查看Node.js开发环境如果没有，请进行引导。
然后，创建一个项目文件夹并确保其中包含package.json包文件，a建造文件夹和型钢混凝土文件夹。这个型钢混凝土文件夹还应包括索引.js文件。
如果您尚未创建package.json包文件之前，导航到终端中的项目文件夹并运行npm初始化命令。一个交互式提示将引导您完成这些步骤。根据需要进行配置，但当它要求“入口点”时，请输入构建/index.js.
当然，有很多方法可以使用wp-脚本，但这是《块编辑器手册》中推荐使用的方法。
最后，安装wp脚本通过运行以下命令将其打包为开发依赖项：
npm install@wordpress/scripts--保存-dev
安装完成后，项目文件夹应如下所示：
项目负责人示例/├── 建造/├── 节点模块/（自动生成）├── 型钢混凝土/│ └── 索引.js├── package-lock.json（自动生成）└── package.json包
安装后，您可以运行随附的预定义脚本wp-脚本通过在脚本部分中引用它们package.json包文件。下面是一个例子：
{“脚本”：{“开始”：“wp脚本开始”，“构建”：“wp-scripts构建”}}
然后可以使用以下命令运行这些脚本npm运行{脚本名称}.
您最常使用的两个脚本是开始和建造因为他们处理构建步骤。请参阅程序包文档适用于所有选项。
在处理项目时，请使用npm运行启动命令。这将启动开发服务器，并在检测到任何更改时自动重新生成项目。请注意构建/index.js不会被优化。
准备部署项目时，请使用npm运行生成命令。这将优化代码并使其生产就绪。
构建完成后，您将看到编译后的JavaScript文件创建于构建/index.js.
A类构建/index.asset.php文件也将在构建过程中创建，其中包含一个依赖项数组和一个版本号（用于缓存破坏）。请注意，要注册一个没有这个的块wp-脚本需要手动创建的构建过程*.asset.php文件依赖项文件（请参见例子).
如果您通过注册区块寄存器块类型中定义的脚本块.json将自动排队（请参阅例子)
要在编辑器中手动将文件排队，在任何其他上下文中，可以参考在编辑器中排队资源指南了解更多信息，但这里是一个典型的实现。
/***将编辑器资源排队。*/函数示例_project_enqueue_editor_assets（）{$asset_file=包含（plugin_dir_path（__file_）。'build/index.asset.php'）；wp_排队_脚本('示例编辑器脚本'，plugins_url（'build/index.js'，__FILE__），$asset_file[“依赖关系”]，$asset_file[“版本”]);}add_action（“enqueue_block_editor_assets”，“example_project_enqueue_Eeditor_asets”）；
这里是一个例子在编辑器中手动排队文件。
同时开始和建造将是两个最常用的脚本，还有其他一些有用的工具wp-脚本这是值得探索的。以下是一些。
为了帮助开发人员提高代码的质量，wp-脚本带有ESLint和Prettier等工具的预配置。ESLint确保JavaScript遵循最佳实践WordPress编码标准，而Prettier会自动格式化代码。可用的脚本包括：
{“脚本”：{“format”：“wp-scripts格式”，“lint:css”：“wp-scripts lint-style”，“lint:js”：“wp-scripts lint-js”，}}
定期对代码进行lint和格式化可以确保代码的功能性、清晰性和可维护性。
除了编写代码外，验证其功能至关重要。wp-脚本包括杰斯特、JavaScript测试框架以及端到端和单元测试脚本：
{“脚本”：{“测试：e2e”：“wp-scripts测试-e2e”，“test:unit”：“wp脚本测试单元js”}}
单元测试验证单个代码单元，如功能，确保它们按预期工作，而端到端（E2E）测试通过模拟真实世界的用户场景来评估整个项目，以确保系统的所有部分无缝地协同工作。
同时wp-脚本提供了可靠的默认配置，在某些情况下可能需要更专门的设置。好消息是wp-脚本适应性强。例如，您可以扩展和覆盖默认的webpack配置，允许您添加加载程序和插件或修改构建过程的几乎任何部分。这种灵活性确保了随着项目的增长或需求的变化，wp-脚本可以根据您不断变化的需求进行定制。
请参阅wp脚本 程序包文档用于所有配置选项。