I tried loading js code in html but no js functionality is reflected in my code.

here is my html snippet

<!DOCTYPE html>

<html>  

Point Of Sale

<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="css/core.css" rel="stylesheet" type="text/css" />
<link href="css/components.css" rel="stylesheet" type="text/css" />
<link href="css/icons.css" rel="stylesheet" type="text/css" />    
<link href="css/responsive.css" rel="stylesheet" type="text/css" />
<link href="plugins/chosen/chosen.min.css" rel="stylesheet" type="text/css" />

<link href="plugins/daterangepicker/daterangepicker.css" rel="stylesheet" type="text/css" />    
<link href="plugins/dataTables/jquery.dataTables.min.css" rel="stylesheet" type="text/css" />
<link href="plugins/dataTables/dataTables.bootstrap.min.css" rel="stylesheet" type="text/css" />   
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script> 
<link href="css/pages.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script type="module" src="./js/pos.js"></script>
<script src="./jquery.min.js"></script>
<script src="./js/product-filter.js"></script>
<script src="https://cdn.jsdelivr.net/npm/print-js"></script>

</head>`

Here is my js snippet

 import path from 'path';
import moment from 'moment';
//import Swal from 'sweetalert2';
import { ipcRenderer } from 'electron';
import Store from 'electron-store';
import { remote } from 'electron';
import btoa from 'btoa';
import { jsPDF } from 'jspdf';
import html2canvas from 'html2canvas';
import JsBarcode from 'jsbarcode';
import macaddress from 'macaddress';
import $ from 'jquery';
import jQuery from 'jquery';

window.$ = $;
window.jQuery = jQuery;
import './renderer.js';

    let cart = [];
let index = 0;
let allUsers = [];
let allProducts = [];
let allCustomers = [];
let allCategories = [];
let allTransactions = [];
let sold = [];
let state = [];
let sold_items = [];
let item;
let auth;
let holdOrder = 0;
let vat = 0;
let perms = null;
let deleteId = 0;
let paymentType = 0;
let receipt = '';

let totalVat = 0;
let subTotal = 0;
let method = '';
let order_index = 0;
let user_index = 0;
let product_index = 0;
let transaction_index;
//let host = 'localhost';
let host = 'xx.xx.xxx.xxx';

let port = 'xxxx';


let dotInterval = setInterval(function () { $(".dot").text('.') }, 3000);


// Define the path to the uploads directory within the current directory

//let api = 'http://' + host + ':' + port + '/rms/api/';
let api = 'https://' + host + '/rms/api/';

let categories = [];
let holdOrderList = [];
let customerOrderList = [];
let ownUserEdit = null;
let totalPrice = 0;
let orderTotal = 0;
let auth_error = 'Incorrect username or password';
let auth_empty = 'Please enter a username and password';
let holdOrderlocation = $("#randerHoldOrders");
let customerOrderLocation = $("#randerCustomerOrders");

let settings;
let platform;
let user = {};

let by_till = 0;
let by_user = 0;
let by_status = 1;
if (typeof remote !== 'undefined') {
    // Code that uses remote
    const app = remote.app;
//let img_path = app.getPath('userData') + '/POS/uploads/';
const img_path = path.join('undefined','POS', 'uploads/');
const currentDirectory = __dirname;
let storage = new Store();
let start = moment().startOf('month');
let end = moment();
let start_date = moment(start).toDate();
let end_date = moment(end).toDate();
}
$(function () {

    function cb(start, end) {
        $('#reportrange span').html(start.format('MMMM D, YYYY') + '  -  ' + end.format('MMMM D, YYYY'));
    }

    

});


$.fn.serializeObject = function () {
    var o = {};
    var a = this.serializeArray();
    $.each(a, function () {
        if (o[this.name]) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};

The html details are displayed as well as the styling but the pos.js is not showing up. the pos.js contains the functionality. I also tried creating a http-server to see if it works but nothing worked

New contributor

HARRISON KURIA is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.