Rails安装fullcalendar-rails失败，报fullCalendar非函数及缺分号错误

语法报错修复 #

当前Missing semicolon报错由不规范的require语法导致，Webpack 环境下 CommonJS 规范要求require调用必须使用括号包裹模块名，将报错行：
require "moment"
修改为：
require("moment");
即可解决该语法问题。

$(...).fullCalendar is not a function报错修复 #

根本原因 #

fullcalendar-rails gem 适配的是 Rails 传统 Asset Pipeline 打包体系，你当前使用的 Rails 6+ 默认采用 Webpack 打包 JS 资源，//= require 这类 Asset Pipeline 指令在 app/javascript/packs/application.js 中完全不生效，导致 fullcalendar 资源未被正确加载。

完整适配方案 #

你后续采用的 npm 版 @fullcalendar 包是适配 Webpack 的正确方案，按以下步骤操作即可完成配置：

1. 移除 Gemfile 中 fullcalendar-rails、momentjs-rails 等相关 gem，执行 bundle install 生效
2. 执行 yarn 命令安装 fullcalendar 相关依赖：

yarn add @fullcalendar/core @fullcalendar/daygrid

3. 替换 application.js 为以下内容，移除无效的 Asset Pipeline 指令，增加 Turbolinks 兼容逻辑：

// This file is automatically compiled by Webpack, along with any other files
// present in this directory. You're encouraged to place your actual application logic in
// a relevant structure within app/javascript and only use these pack files to reference
// that code so it'll be compiled.

import Rails from "@rails/ujs"
import Turbolinks from "turbolinks"
import * as ActiveStorage from "@rails/activestorage"
import "channels"

// 无jquery需求可删除下一行
import $ from "jquery";

Rails.start()
Turbolinks.start()
ActiveStorage.start()

import { Calendar } from '@fullcalendar/core';
import dayGridPlugin from '@fullcalendar/daygrid';

document.addEventListener('turbolinks:load', () => {
  const calendarEl = document.getElementById('calendar');
  if (!calendarEl) return;
  const calendar = new Calendar(calendarEl, {
    plugins: [dayGridPlugin],
    initialView: 'dayGridMonth'
  });
  calendar.render();
});

4. 在项目CSS入口文件（通常为app/assets/stylesheets/application.css）中引入 fullcalendar 样式：

@import "@fullcalendar/common/main.min.css";
@import "@fullcalendar/daygrid/main.min.css";

注意事项 #

• 不要混用 Asset Pipeline 的//= require指令和Webpack的import/require语法，两者属于完全独立的打包体系
• 确保渲染日历的页面中存在id="calendar"的DOM节点
• 如需要使用jquery风格的fullCalendar()调用，需额外安装@fullcalendar/jquery包，不推荐新项目使用该旧写法。

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