在 Ubuntu 环境下开发 JavaScript 项目,时常需要引入第三方库。通常有两种主流方式:使用 npm 或 yarn 包管理器进行本地安装,或者直接在 HTML 中通过 CDN 引用。下面将这两种方法详细拆解,帮你快速掌握。

方法一:使用 npm 或 yarn(推荐)
首先确认你的系统已安装 Node.js 和 npm。若未安装,可前往 Node.js 官网下载安装包,按默认步骤完成安装。接着打开终端,进入你的项目目录。如果尚未创建项目,请先新建一个:
mkdir my_project
cd my_project
接下来初始化项目,生成 package.json 文件,该文件相当于项目的“依赖清单”:
npm init -y
或者使用 yarn 执行:
yarn init -y
然后安装所需的库。例如,要安装 Axios(一款流行的 HTTP 请求库),运行以下命令:
npm install axios
使用 yarn 则执行:
yarn add axios
安装完成后,在 JavaScript 文件里引用它。使用 npm 时,用 require 引入;使用 yarn 时,可用 import 引入。以下是在 index.js 中的示例:
// 对于 npm
const axios = require('axios');
// 对于 yarn
import axios from 'axios';
// 然后就可以直接用 Axios 发送请求
axios.get('https://api.example.com/data')
.then(response => {
console.log(response.data);
})
.catch(error => {
console.error(error);
});
注意:使用 import 语法需要在 package.json 中设置 "type": "module",或使用 .mjs 后缀,否则会报错。目前大多数项目默认采用 CommonJS 模块规范,因此 require 是最稳妥的方案。
方法二:通过 CDN 引入库
如果不希望安装包,也可以直接在 HTML 文件中添加 标签,引用 CDN 地址。例如,同样引入 Axios:
然后在该 标签后面,再编写一个 标签放置你的代码。由于 CDN 加载的库会暴露到全局作用域,直接调用 axios 即可:
CDN 方案的优势在于零配置,适合快速原型开发或简单的静态页面。但缺点也很明显:依赖网络环境,且版本管理不如 npm 方便。生产环境建议优先使用本地安装方式。
总之,在 Ubuntu 下使用 JavaScript 整合第三方库,主要就是这两种途径。小型项目或临时测试可选用 CDN,正式项目则推荐使用 npm 或 yarn,根据具体场景灵活选择即可。
