Laravel项目引入moment.js库遇报错，求正确引入方法

问题根源 #

你执行npm install moment --save后尝试的两种引入方式均存在问题：

• 直接引用node_modules路径：node_modules目录不在Laravel的公开访问目录（public）下，浏览器无法直接获取该路径文件，因此报404错误。
• 使用asset()函数时未加引号：asset()的参数需为字符串，未加引号的node_modules/moment/min/moment.min.js会被PHP识别为常量，触发Undefined constant "node_modules"错误。

正确引入方式 #

方法一：Laravel Mix编译打包（推荐） #

Laravel官方推荐用Mix管理前端资源，步骤如下：

1. 在resources/js/app.js中导入moment.js：

import moment from 'moment';
// 如需全局调用，挂载到window对象
window.moment = moment;

2. 执行编译命令：

npm run dev # 开发环境
# 生产环境用压缩版
npm run prod

3. 在Blade模板中引入编译后的资源（通常父模板已默认引入，确认即可）：

<script src="{{ asset('js/app.js') }}"></script>

方法二：手动复制文件到public目录 #

如果不想用Mix编译，可手动复制文件到可访问目录：

1. 复制node_modules/moment/min/moment.min.js到public/js/moment.min.js
2. 在模板中引用：

<script src="{{ asset('js/moment.min.js') }}"></script>

方法三：CDN引入（快速临时方案） #

无需npm安装，直接在模板中加入CDN链接：

<script src="https://cdn.jsdelivr.net/npm/moment@2.29.4/min/moment.min.js"></script>

内容的提问来源于stack exchange，提问作者dcher