Как заставить Webpack работать с FullCalendar

При сборке c FullCalendar выдает ошибку в консоли Uncaught ReferenceError: FullCalendar is not defined Импорты в
index.js

import * as $ from 'jquery';
import jQueryUI from 'jquery-ui';
import { Calendar } from '@fullcalendar/core';
import moment from 'moment';

document.addEventListener('DOMContentLoaded', function() {
  var calendarEl = document.getElementById('calendar');

  var calendar = new FullCalendar.Calendar(calendarEl, {
    initialView: 'dayGridMonth',
    initialDate: '2020-10-07',
    headerToolbar: {
      left: 'prev,next today',
      center: 'title',
      right: 'dayGridMonth,timeGridWeek,timeGridDay'
    },
  });

  calendar.render();
});

конфиг webpack.config.js

const path = require('path');
const webpack = require('webpack');
const HTMLWebpackPlugin = require('html-webpack-plugin')
const {CleanWebpackPlugin} = require('clean-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const OptimizeCssAssetWebpackPlugin = require('optimize-css-assets-webpack-plugin')
const flatpickr = require("flatpickr");


module.exports = {
    context: path.resolve(__dirname, 'src'),
    mode: 'development',
    entry: "./index.js",
    
    output: {
        filename: 'js/[name].js',
        path: path.resolve(__dirname, 'dist'),
    },
    resolve: {
        extensions: ['.js', '.json', '.png'],
        alias: {
            '@': path.resolve(__dirname, 'src'),
        }
    },
    optimization: {
        splitChunks: {
            chunks: 'all'
        }
    },
    devServer: {
        port: 4200
    },
    devServer: {
        contentBase: './src',
        port: 7700,
    },
    module: {
        rules: [
               {test: /\.css$/, use: [{loader: MiniCssExtractPlugin.loader,options: {hrm: true,reloadAll: true,},},'css-loader']},
               {test: /\.s[ac]ss$/, use: [{loader: MiniCssExtractPlugin.loader,options: {hrm: true,reloadAll: true,publicPath: '../',},},
               'css-loader','sass-loader', 'resolve-url-loader']},
               {test: /\.(png|jpe?g|gif|svg)$/,loader: 'file-loader',options: {outputPath: 'assets/images',name: '[name].[ext]',},},
               {test: /\.(ttf|woff|woff2|eot|)$/,loader: 'file-loader',options: {outputPath: 'assets/fonts',name: '[name].[ext]',},},
        ]
    },
    
    plugins: [
        new MiniCssExtractPlugin({
            filename: 'css/[name].css',
        }),
        new webpack.ProvidePlugin({
            $: 'jquery',
            jQuery: 'jquery',
            'window.jQuery': 'jquery',
            "moment": "moment"
        }),
        new HTMLWebpackPlugin({
            filename: 'index.html',
            template: './index.html',
        }),
        new CleanWebpackPlugin(),
        new CopyWebpackPlugin({
            patterns: [{
                from: path.resolve(__dirname, './src/assets/ico/favicon.ico'),
                to: path.resolve(__dirname, 'dist/assets/ico/favicon.ico')
            }]
        }),
        new CopyWebpackPlugin({
            patterns: [{
                from: path.resolve(__dirname, './src/style/scss'),
                to: path.resolve(__dirname, 'dist/scss/')
            }]
        }),
        new CopyWebpackPlugin({
            patterns: [{
                from: path.resolve(__dirname, './src/assets/images'),
                to: path.resolve(__dirname, 'dist/assets/images')
            }]
        }),
    
    ],
    


}

Ответы (0 шт):