emmetio / codemirror-plugin Goto Github PK

View Code? Open in Web Editor NEW

73.0 73.0 12.0 1.68 MB

Emmet plugin for CodeMirror web editor

License: MIT License

JavaScript 3.19% HTML 8.26% CSS 2.83% TypeScript 85.72%

codemirror emmet

codemirror-plugin's People

Contributors

Stargazers

Watchers

Forkers

webextensions tonyonodi tcolapietro79 taijiweb stanwmusic ddonng nomli agiesp adamkeinan doc22940 isabella232 stjordanis

codemirror-plugin's Issues

abbreviation preview doesn't work

I have a project using codemirror and emmetio which uses some other functionality from codemirror.
The preview of abbreviation does not show up.
I have tried removing all extra functinality except for syntax highlighting and sublime however that did not work (emmet didn't even work at all without syntax highlighting)

there are no errors and i can use emmet as usual just without the preview.

help?

Pasting a URL, Emmet Throws Expansion Error

This Combo Freezes the Browser

Put <div>1</div> in the HTML
Select characters >1</div with cursor
Hit Backspace
The page stops responding and finally crashes with error "Out of Memory"

Can reproduce at http://download.emmet.io/codemirror/index.html

No 'dist' folder

Repository didn't contains a 'dist' folder, how can i make emmet work on codemirror then?

Preview not close on change instance

I working with codemirror 5.2 and stand alone mode with Browser.js
I suggest add the events swapDoc and Blur
editor.on('blur', () => proxy.hidePreview()); editor.on('swapDoc', () => proxy.hidePreview());
Any suggestions?

Tab-expanding dash-separated properties

If you TAB after a fully-written CSS property, it has weird effects:

body {
  background-color[CURSOR]
}

Then press tab, you get:

body {
  background: color;
}

Which is pretty weird, you'd think it would either do nothing since it's already expanded, or give you the more complete syntax like:

body {
  background-color: #fff;
}

the plugin does not work well

It's been a while since the plugin looks like this and I don't know why

this is my package.json

my code is exactly the same as shown in their documentation

After pressing Tab it doesn't remove the symbol itself.

If I enter "p" + Tab it gives: '

p' . Is there anything wrong with the settings? Thanks.

Snippets with Multiple Cursors

CodeMirror supports multiple cursors, so Emmet snippets could too!

Like:

width: ${1};\nheight: ${1};

react-codemirror2

please show me how to connect it with react-codemirror2. I make mistakes...

Minifying with uglify fails because build doesn't target ES5

I'm attempting to use this project in a project that uses Create React App, which uses Uglify when building. When I try to build I get the following error message

Failed to compile.

Failed to minify the code from this file: 

        ./node_modules/@emmetio/stream-reader/dist/stream-reader.es.js:4 

Read more here: http://bit.ly/2tRViJ9

The link in the error message is very instructive and explains the issue well. Basically Uglify needs code that is compiled to ES5 to work and codemirror-plugin doesn't do this

I have already forked codemirror-plugin and its dependencies and have begun the process of modifying them to target ES5, but it's slow going because I'm not familiar with rollup or mocha and I'm unable to get any of the tests to pass and I don't know if what I have at the end of it will be good enough to merge into this project.

Unable to consume abbreviation node, unexpected 60 at char 5

How i can fix or avoid this warning?

CodeMirror 5 + Sublime Text Key Bindings + Multiple Selections =

So Command-D in "normal" emmet does outward-expansion. But in CodeMirror, if you turn on the official Sublime Text bindings:

https://codemirror.net/demo/sublime.html

Then Command-D gets replaced with "select next occurrence" (selectNextOccurrence).

Because CodeMirror supports multiple selections/multiple cursors, that means you don't just have the original selection, but it keeps adding to the selection.

That's all fine, and so far working as expected:

CleanShot.2021-06-22.at.05.52.22.mp4

But that's without Emmet.

I would test it here, but this demo doesn't have Sublime Text bindings on:

https://download.emmet.io/codemirror/index.html

On CodePen, we do (you have to turn on Sublime Text bindinds, and Emmet, in Editor Preferences).

When BOTH are active, in HTML specifically, something gets funky with line positions. You can see here:

CleanShot.2021-06-22.at.05.54.24.mp4

It looks like maybe Emmet's tag-matching thing is catching the second-and-beyond selection?

Emmet html5

Hello,
I to try generate html5 (!+tab), but get code:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
  
</body>
</html>

How to get code like this?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

Adding Emmet to already initialized CodeMirror

Hello,

I'm coding a chrome extension to Shopify to add emmet to the built-in online editor.

The CodeMirror editor in there is already initialized and I'm grabbing it as so:

var $cm = document.querySelector('.CodeMirror').CodeMirror;

How could I initialize emmet using this existing instance without FromTextArea?

Thanks!

Custom Snippet Breakage

A user of CodePen found that if you make a custom snippet that is essentially:

"gt": "grid-template: repeat(2,auto) / repeat(auto-fit, minmax(250px, 1fr))"

Emmet 2 doesn't expand that but instead moves focus out of the editor.

Invalid preview trigger on uppercased word

Typing Uppercase word incorrectly triggers abbreviation preview

Codemirror 6

Are there any plans to support codemirror 6?