简体   繁体   中英

StencilJS component ReferenceError: “module is not defined” error in Firefox when adding third party script

I have an issue with a component in Firefox. I tested in pretty much all browsers, Safari, Opera, Brave, Chrome … only Firefox Quantum 66.0.3 (64-bit) has problems.

The code I provided is a basic version of the whole component. The error I get is ReferenceError: "module is not defined" and TypeError: "jQuery(...).setsameheight is not a function" . (jQuery is also loaded by script.js) when running Stencil locally with npm start --es5 . I really don't know what else to try.

The script is required for the project, it can't be edited.

I am using “@stencil/core”: “0.18.0" , as a component builder. I also tried with “@stencil/core”: “~0.16.2"

import { Component, Prop, State, Element } from '@stencil/core';
import * as SCRIPT from '../../assets/script.js';

declare var jQuery: any;

@Component({
  tag: 'events',
  shadow: false
})

export class Events {

  @Element() private element: HTMLElement;

  componentDidLoad() {
    SCRIPT
  }

  componentDidUpdate() {
      const elements = this.element.querySelectorAll('div.fluid')
      for (let element of elements) {
        jQuery(element).setsameheight()
      }
    }

}

The ReferenceError points here community-component.core.pf.js:2485:7

function execBundleCallback(bundleId, deps, callback) {
    var bundleExports = {};
    try {
      callback.apply(null, deps.map(function(d) {
        if ('exports' === d) return bundleExports;
        if ('require' === d) return userRequire;
        return getLoadedBundle(d);
      }));
    } catch (e) {
      console.error(e); //line 2485
    }

It seems like your '../../assets/script.js' is not getting loaded in firefox . To make import statement work, you need to set dom.moduleScripts.enabled to true .

See - https://starbeamrainbowlabs.com/blog/article.php?article=posts/260-es6-features-14-modules.html as well as Browser compatibility from section - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import

在此输入图像描述

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM