vueup / vue-quill

Rich Text Editor Component for Vue 3.
https://vueup.github.io/vue-quill/
MIT License
1.13k stars 282 forks source link

Bug in prodution, coming from the dist package in the node_module that doesnt import the Op.lenth() function #395

Closed RamonGal closed 1 year ago

RamonGal commented 1 year ago

Version @vueup/vue-quill version 1.2.0

Describe the bug I am using the Quill editor and currently it works in development, but after building the project to production, the quill gives an error regarding the OpIterator.ts file:

runtime-core.esm-bundler.js:244 TypeError: Op_1$1.default.length is not a function
    at Iterator2.peekLength (Iterator.js:63:33)
    at Delta.js:259:55
    at Array.forEach (<anonymous>)
    at Delta2.diff (Delta.js:253:20)
    at internalModelEquals (vue-quill.esm-bundler.js:225:73)
    at watch.deep (vue-quill.esm-bundler.js:339:42)
    at callWithErrorHandling (runtime-core.esm-bundler.js:173:22)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js:182:21)
    at job (runtime-core.esm-bundler.js:1812:17)
    at callWithErrorHandling (runtime-core.esm-bundler.js:173:36)

from the following code that it creates in the node_modules dist of the library:


// built code
Iterator.prototype.peekLength = function () {
    if (this.ops[this.index]) {
        // Should never return 0 if our index is being managed correctly
        return Op_1.default.length(this.ops[this.index]) - this.offset;
    }
    else {
        return Infinity;
    }
};

// original code 
peekLength(): number {
  if (this.ops[this.index]) {
    // Should never return 0 if our index is being managed correctly
    return Op.length(this.ops[this.index]) - this.offset;
  } else {
    return Infinity;
  }
}

Im currently using vue-quill, that uses the versions: "quill": "^1.3.7", "quill-delta": "^4.2.2"

This is my compiler options, in case this comes from an incompatibility from Delta's es2015:

 "compilerOptions": {
    "target": "esnext",
    "useDefineForClassFields": true,
    "module": "esnext",
    "moduleResolution": "node",
    "strict": true,
    "jsx": "preserve",
    "sourceMap": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "esModuleInterop": true,
    "lib": ["esnext", "dom"],
    "skipLibCheck": true,
    "allowJs": true,
    "allowSyntheticDefaultImports": true,
    "types": ["cypress", "node"],
    "outDir": "./built",
    "baseUrl": "./",
    "paths": {
      "@/*": ["./src/*"],
      "@components/*": ["./src/components/*"],
      "@services/*": ["./src/services/*"],
      "@views/*": ["./src/views/*"],
      "@utils/*": ["./src/utils/*"],
      "@stores/*": ["./src/stores/*"],
      "@apps/*": ["./src/apps/*"]
    },
    "ignoreDeprecations": "5.0"
  },

Here the Op function does not get exported with the default:

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var Iterator_1 = __importDefault(require("./Iterator"));
var Op;
(function (Op) {
    function iterator(ops) {
        return new Iterator_1.default(ops);
    }
    Op.iterator = iterator;
    function length(op) {
        if (typeof op.delete === 'number') {
            return op.delete;
        }
        else if (typeof op.retain === 'number') {
            return op.retain;
        }
        else {
            return typeof op.insert === 'string' ? op.insert.length : 1;
        }
    }
    Op.length = length;
})(Op || (Op = {}));
exports.default = Op;
//# sourceMappingURL=Op.js.map
stale[bot] commented 1 year ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.