Yarn 是 JavaScript 的软件包管理器,由 Facebook 与其他公司合作开发,旨在解决 npm(Node 软件包管理器)的一些不足之处。它以速度、可靠性和安全性著称。

常见的 Yarn 命令
以下是一些常见的 Yarn 命令及其 npm 对应命令:

初始化新项目

yarn init

等同于 npm init

添加软件包

yarn add [package-name]

Equivalent to npm install [package-name] --save

Add a Package as a Dev Dependency

yarn add [package-name] --dev

Remove a Package

yarn remove [package-name]

Equivalent to npm uninstall [package-name] --save

Install All Dependencies

yarn install

Equivalent to npm install

Update a Package

yarn upgrade [package-name]

Equivalent to npm update [package-name]

Run a Script

yarn run [script]

List Installed Packages

yarn list

使用场景

  • 速度和效率: Yarn 会并行安装软件包,与 npm 相比,它能显著加快安装进程,尤其是在依赖关系较多的项目中。

  • 可靠性: Yarn 使用锁文件(yarn.lock)来确保在每台机器上都安装了完全相同的依赖项。这有助于避免 “在我的机器上能用 ”的问题。

  • 安全性 在执行代码前,Yarn 使用校验和来验证每个已安装软件包的完整性。

问题在script标签的type="module" 上.... 不加这个type就正常了

==>
当在<script>标签中使用type="module"时,您告诉浏览器该脚本应当作JavaScript模块来处理。这意味着:
默认严格模式:模块自动处于严格模式下,您不需要在脚本顶部显式声明"use strict";。
模块作用域:在模块脚本中声明的变量、函数等不会自动成为全局作用域的一部分。它们只存在于模块作用域内,除非您显式地导出或导入它们。
支持模块导入和导出:您可以使用import和export语句在模块之间共享代码。

在使用Parcel这类构建工具时,它负责处理模块的打包和依赖管理。如果您的项目被构建为一个单一的打包文件,而您在引入这个文件时使用了type="module",那么可能会发生一些不一致的行为,因为Parcel已经将模块和其他代码转换成了浏览器可以直接执行的格式。具体表现取决于Parcel的版本和配置,以及您的项目结构。
如果不使用type="module"属性,脚本会被当作传统的JavaScript脚本来处理,这可能和Parcel构建的输出更加兼容,特别是如果Parcel已经处理了所有必要的模块转换。
如何决定是否使用type="module"?
如果您直接在HTML中编写或引入ES模块(也就是说,不通过构建工具处理),那么使用type="module"是正确和必要的。
如果您通过构建工具(如Parcel、Webpack等)构建项目,并且构建输出是一个自包含的脚本,那么通常不需要在引用构建后的脚本时使用type="module",除非您有特定的理由或构建工具的文档特别建议这样做。