Tajuk ditulis semula sebagai: Skrip modul JavaScript yang dijangkakan, tetapi pelayan membalas dengan jenis MIME teks/html dan teks/css - tiada bingkai, JS tulen

Question

Saya cuba menggunakan kalendar warna dan saya mengikuti tutorial yang mereka lihat dalam demo dan dokumentasi seperti ini:

// js/calendar.js

import Calendar from '../node_modules/color-calendar';
import '../node_modules/color-calendar/dist/css/theme-glass.css';

let calA = new Calendar({
  id: "#color-calendar",
  theme: "glass",
  // border: "5px solid black",
  weekdayType: "long-upper",
  monthDisplayType: "long",
  // headerColor: "yellow",
  // headerBackgroundColor: "black",
  calendarSize: "small",
  layoutModifiers: ["month-left-align"],
  eventsData: [
    {
      id: 1,
      name: "French class",
      start: "2020-12-17T06:00:00",
      end: "2020-12-18T20:30:00"
    },
    {
      id: 2,
      name: "Blockchain 101",
      start: "2020-12-20T10:00:00",
      end: "2020-12-20T11:30:00"
    },
    {
      id: 3,
      name: "Cheese 101",
      start: "2020-12-01T10:00:00",
      end: "2020-12-02T11:30:00"
    },
    {
      id: 4,
      name: "Cheese 101",
      start: "2020-12-01T10:00:00",
      end: "2020-12-02T11:30:00"
    }
  ],
  dateChanged: (currentDate, events) => {
    console.log("date change", currentDate, events);
  },
  monthChanged: (currentDate, events) => {
    console.log("month change", currentDate, events);
  }
});

dan HTML saya:

// dashboard.html
...
<div class="col">
  <div class="calendar-container">
    <div id="color-calendar"></div>
    <div id="events-display"></div>
  </div>
</div>
...
<script type="module" src="js/calendar.js"></script>

Saya cuba menggunakan sambungan http-server dan Pelayan Langsung untuk menyemak sama ada ia menyelesaikan masalah tetapi masalah berterusan.

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/css". Strict MIME type checking is enforced for module scripts per HTML spec.

Saya mendapat kedua-dua ini pada konsol alat dev saya

Untuk maklumat tambahan, inilah pakej saya.json

{
  "dependencies": {
    "color-calendar": "^1.0.7",
    "http-server": "^14.1.1"
  }
}

Saya tidak tahu apa yang perlu dilakukan lagi...tiada Node.js, tiada rangka kerja, hanya menggunakan javascript, html dan css.

Answer 1

Penyelesaian yang dibawa oleh Konrad dan Stefino76 berkesan.

Saya memasang pek web pada projek saya dan mengkonfigurasinya untuk menerima js dan css dalam fail .js dan kini kalendar berfungsi!

Semua kredit harus diberikan kepada mereka, tetapi saya rasa saya tidak boleh menandakan jawapan mereka sebagai telah diselesaikan.