dianping/cat · error · Error

You can't provide both 'acceptedFiles' and 'acceptedMimeType

Error message

You can't provide both 'acceptedFiles' and 'acceptedMimeTypes'. 'acceptedMimeTypes' is deprecated.

What it means

Dropzone supports two ways to restrict accepted files: the older acceptedMimeTypes (deprecated) and the newer acceptedFiles (comma-separated extensions/mime globs). Supplying both at once is ambiguous, so the constructor rejects the combination with an explicit deprecation message.

Source

Thrown at cat-home/src/main/webapp/assets/js/uncompressed/dropzone.js:598

      }
      if (this.element.dropzone) {
        throw new Error("Dropzone already attached.");
      }
      Dropzone.instances.push(this);
      this.element.dropzone = this;
      elementOptions = (_ref = Dropzone.optionsForElement(this.element)) != null ? _ref : {};
      this.options = extend({}, this.defaultOptions, elementOptions, options != null ? options : {});
      if (this.options.forceFallback || !Dropzone.isBrowserSupported()) {
        return this.options.fallback.call(this);
      }
      if (this.options.url == null) {
        this.options.url = this.element.getAttribute("action");
      }
      if (!this.options.url) {
        throw new Error("No URL provided.");
      }
      if (this.options.acceptedFiles && this.options.acceptedMimeTypes) {
        throw new Error("You can't provide both 'acceptedFiles' and 'acceptedMimeTypes'. 'acceptedMimeTypes' is deprecated.");
      }
      if (this.options.acceptedMimeTypes) {
        this.options.acceptedFiles = this.options.acceptedMimeTypes;
        delete this.options.acceptedMimeTypes;
      }
      this.options.method = this.options.method.toUpperCase();
      if ((fallback = this.getExistingFallback()) && fallback.parentNode) {
        fallback.parentNode.removeChild(fallback);
      }
      if (this.options.previewsContainer !== false) {
        if (this.options.previewsContainer) {
          this.previewsContainer = Dropzone.getElement(this.options.previewsContainer, "previewsContainer");
        } else {
          this.previewsContainer = this.element;
        }
      }
      if (this.options.clickable) {
        if (this.options.clickable === true) {

View on GitHub (pinned to e815e74d4c)

Solutions

  1. Delete acceptedMimeTypes and keep only acceptedFiles: { acceptedFiles: 'image/*,.png,.jpg' }.
  2. Search config files/data attributes for acceptedMimeTypes and remove all occurrences.
  3. Migrate mime strings: acceptedMimeTypes:'image/jpeg' becomes acceptedFiles:'image/jpeg' (same syntax is accepted).

Example fix

// before
new Dropzone(el, {
  url: '/upload',
  acceptedMimeTypes: 'image/*',   // deprecated
  acceptedFiles: '.jpg,.png'
});

// after
new Dropzone(el, {
  url: '/upload',
  acceptedFiles: 'image/*,.jpg,.png'
});
Defensive patterns

Strategy: validation

Validate before calling

if (opts.acceptedMimeTypes) {
  opts.acceptedFiles = opts.acceptedFiles || opts.acceptedMimeTypes;
  delete opts.acceptedMimeTypes;
}
new Dropzone(el, opts);

Prevention

When it happens

Trigger: new Dropzone(el, { acceptedFiles: '.png,.jpg', acceptedMimeTypes: 'image/*' }); configuration carried over from an old Dropzone 3.x setup where new options were added without removing the deprecated key; data attributes or JSON config that contains both keys.

Common situations: Upgrading dropzone versions and layering the new acceptedFiles on top of legacy acceptedMimeTypes; shared config objects merged from defaults (old) and overrides (new).

Related errors


AI-assisted analysis of dianping/cat@e815e74d4c (2026-08-14). Data as JSON: /api/errors/5692d4d1ab7fb542. Report an issue: GitHub.