search

Ionaru / easy-markdown-editor

EasyMDE: A simple, beautiful, and embeddable JavaScript Markdown editor. Delightful editing for beginners and experts alike. Features built-in autosaving and spell checking.
https://stackblitz.com/edit/easymde
MIT License
2.45k stars 319 forks source link

CodeMirror.commands undefined when importing package #43

Open marcuslind90 opened 5 years ago

marcuslind90 commented 5 years ago

I'm submitting a...

Reproduction steps

  1. Install package npm install --save easymde
  2. Use webpack to bundle your js and point it to an entrypoint javascript file.
  3. Import it in your JS file import "easymde" or import { EasyMDE } from "easymde" or import * as EasyMDE from "easymde"
  4. Visit page that JS is loaded, it will say CodeMirror.commands is undefined in browser console.

If I import the minified js file (see below) it works fine, so I guess the issue is related to the bundling, perhaps some dependency or something that have to be set in the webpack config file that is not specified?

const EasyMDE = require('easymde/dist/easymde.min.js');

Version information

Browser type and version: Chrome/Firefox EasyMDE version: 2.4.2

FranklinWhale commented 5 years ago

Facing a similar issue that import "easymde/dist/easymde.min.css"; works but not import "easymde/src/css/easymde.css";

Ionaru commented 5 years ago

So this is probably caused by https://github.com/Ionaru/easy-markdown-editor/blob/master/src/js/codemirror/tablist.js#L6

What happens when you manually import CodeMirror first?

EasterPeanut commented 3 years ago

Any solution to this yet? We are migrating from Brunch to Webpack and run into the exact same issue.

EasyMDE 2.13.0 Webpack 5.4.0

@Ionaru if I try to import CodeMirror first as follows, it does not change the error:

import CodeMirror from "codemirror";
import EasyMDE from "easymde";
import "easymde/dist/easymde.min.css";
Ionaru commented 3 years ago

I don't have a lot of experience with Webpack so I can't say what a good solution would be. The workaround is to use the minified package, that includes CodeMirror.

EasterPeanut commented 3 years ago

Too bad, was wondering if anyone found out in the meantime. I guess it has something to do with requiring modules that can't be resolved, but I could not figure it out as I am no JS expert. Either way, for now we'll use the minified version :)