# PGMonaco - Monaco Editor for PG

**URL:** <https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913>\
**Category:** Third party Apps & plugins related to Pinegrow\
**Created:** [February 1, 2021, 1:49am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913 "2021-02-01T01:49:20Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![ehigiepaul](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/ehigiepaul/32/2339_2.png) [@ehigiepaul](https://forum.pinegrow.com/u/ehigiepaul)\
**Post date:** [February 1, 2021, 1:49am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/1 "2021-02-01T01:49:20Z")

</div>

**PGMonaco** Plugin is an integration of monaco code editor to PG which is the same code editor used in Visual Studio Code.

Available features:

- emmet for html and css

- support for html, css, C#, json razor, typescript and javascript enabled

- Perfect intellisense for all language

- Click on none html files and auto open on editor

- Auto update preview

- go to line - Ctrl + G

- open editor - F7

- pop out editor

- single tab editor for now because of layout bug

- All basic monaco feature avaliable

- and more to come.

Coming soon let me know PG users are interested just by liking this post.  
Thanks and stay safe.

 ![multi languages](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/0/08b7d318fbab956b45efd773e3fe0db7f9c32f84.png)  
Multi language support

 ![html intellisense](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/5/558efa5a10a6149ce9756f348938289d904c62a7.png)  
Language Intelisence

 ![command pallete](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/2/2aef67cbde58242977beb2dfb55c9f35877e3854.png)  
Basic monaco features available

 ![pop up](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/e/ec23e45887ddee7cd22337894b0b6acfc8dde842.png)  
Pop up editor

---

<div class="post-metadata">

**Author:** ![AllMediaLab](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/allmedialab/32/2079_2.png) [@AllMediaLab](https://forum.pinegrow.com/u/AllMediaLab)\
**Post date:** [February 1, 2021, 8:31am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/2 "2021-02-01T08:31:10Z")

</div>

Hi @ehigiepaul,

Nice work!

It would only make sense for me to use the Monaco editor in Pinegrow if the Terminal is implemented and I could use npm gulp git etc. etc. That way you are able to use a “build system” in Pinegrow. And it is important to be able to install the plugins your self I think.

Normally I use Sublime Text, Terminus and a bunch of plugins and use Pinegrow for the quick design of a website.

Regards,  
David

---

<div class="post-metadata">

**Author:** ![ehigiepaul](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/ehigiepaul/32/2339_2.png) [@ehigiepaul](https://forum.pinegrow.com/u/ehigiepaul)\
**Post date:** [February 1, 2021, 9:11am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/3 "2021-02-01T09:11:32Z")

</div>

Terminal is still part of the features coming soon  
also with a project wide intellisense which will help a find and replace in file on project 🤞🤞

---

<div class="post-metadata">

**Author:** ![AllMediaLab](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/allmedialab/32/2079_2.png) [@AllMediaLab](https://forum.pinegrow.com/u/AllMediaLab)\
**Post date:** [February 1, 2021, 9:20am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/4 "2021-02-01T09:20:30Z")

</div>

And what about PHP and includes that are not recognized at the moment by Pinegrow?  
In VS code I can open PHP pages with the proper plugins and config!

---

<div class="post-metadata">

**Author:** ![ehigiepaul](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/ehigiepaul/32/2339_2.png) [@ehigiepaul](https://forum.pinegrow.com/u/ehigiepaul)\
**Post date:** [February 1, 2021, 9:38am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/5 "2021-02-01T09:38:56Z")

</div>

Will enable php support today.

---

<div class="post-metadata">

**Author:** ![TechAkayy](https://avatars.discourse-cdn.com/v4/letter/t/ce73a5/32.png) [@TechAkayy](https://forum.pinegrow.com/u/TechAkayy)\
**Post date:** [February 1, 2021, 9:44am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/6 "2021-02-01T09:44:29Z")

</div>

Are you able to add support for vuejs? (Vetur - [GitHub - vuejs/vetur: Vue tooling for VS Code.](https://github.com/vuejs/vetur))

---

<div class="post-metadata">

**Author:** ![ehigiepaul](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/ehigiepaul/32/2339_2.png) [@ehigiepaul](https://forum.pinegrow.com/u/ehigiepaul)\
**Post date:** [February 1, 2021, 9:47am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/7 "2021-02-01T09:47:04Z")

</div>

That was one of the main plan to support .vue files but alot of work to be done with vue for now, but hope to get it working in the nearest future.

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [February 1, 2021, 10:28am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/8 "2021-02-01T10:28:40Z")

</div>

Looks great! I’ll be interested in the final product.

---

<div class="post-metadata">

**Author:** ![AllMediaLab](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/allmedialab/32/2079_2.png) [@AllMediaLab](https://forum.pinegrow.com/u/AllMediaLab)\
**Post date:** [February 1, 2021, 10:42am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/9 "2021-02-01T10:42:58Z")

</div>

> [@ehigiepaul](#):
>
> Will enable php support today.

Great! Is it not a idea to try to implement the plugin manager?

---

<div class="post-metadata">

**Author:** ![TechAkayy](https://avatars.discourse-cdn.com/v4/letter/t/ce73a5/32.png) [@TechAkayy](https://forum.pinegrow.com/u/TechAkayy)\
**Post date:** [February 1, 2021, 10:44am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/10 "2021-02-01T10:44:13Z")

</div>

Guess php will be listed in the dropdown in the first image above…

---

<div class="post-metadata">

**Author:** ![ehigiepaul](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/ehigiepaul/32/2339_2.png) [@ehigiepaul](https://forum.pinegrow.com/u/ehigiepaul)\
**Post date:** [February 1, 2021, 10:45am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/11 "2021-02-01T10:45:01Z")

</div>

Can you explain the idea well so I could understand the feature

---

<div class="post-metadata">

**Author:** ![AllMediaLab](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/allmedialab/32/2079_2.png) [@AllMediaLab](https://forum.pinegrow.com/u/AllMediaLab)\
**Post date:** [February 1, 2021, 10:46am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/12 "2021-02-01T10:46:16Z")

</div>

I mean the VS code plugin manager to be able to install plugins by choice! Or your own plugin manager.  
And a built in update possibility for Monaco it self.

---

<div class="post-metadata">

**Author:** ![ehigiepaul](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/ehigiepaul/32/2339_2.png) [@ehigiepaul](https://forum.pinegrow.com/u/ehigiepaul)\
**Post date:** [February 1, 2021, 10:50am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/13 "2021-02-01T10:50:54Z")

</div>

I will review the idea but note for now I cant add VScode plugins into monaco till I figure out the process out maybe this idea will be added.

---

<div class="post-metadata">

**Author:** ![AllMediaLab](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/allmedialab/32/2079_2.png) [@AllMediaLab](https://forum.pinegrow.com/u/AllMediaLab)\
**Post date:** [February 1, 2021, 10:52am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/14 "2021-02-01T10:52:18Z")

</div>

> **[microsoft/vscode-vsce](https://github.com/microsoft/vscode-vsce)**
>
> VS Code Extension Manager. Contribute to microsoft/vscode-vsce development by creating an account on GitHub.

---

<div class="post-metadata">

**Author:** ![TechAkayy](https://avatars.discourse-cdn.com/v4/letter/t/ce73a5/32.png) [@TechAkayy](https://forum.pinegrow.com/u/TechAkayy)\
**Post date:** [February 1, 2021, 10:54am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/15 "2021-02-01T10:54:39Z")

</div>

Looking at [Monaco Editor](https://microsoft.github.io/monaco-editor/) on github, i guess monaco editor integration is a slice of the Vs-code… guessing Paul has a good idea of what this slide provides… it’s still amazing to have it within PG… VS-code plugin manager might not be part of the monaco oss features…

---

<div class="post-metadata">

**Author:** ![AllMediaLab](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/allmedialab/32/2079_2.png) [@AllMediaLab](https://forum.pinegrow.com/u/AllMediaLab)\
**Post date:** [February 1, 2021, 11:02am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/16 "2021-02-01T11:02:36Z")

</div>

Yes I’m afraid you are right about this:

> <https://github.com/microsoft/monaco-editor/issues/1970>
>
> When developing a vscode extension, it would be great if I can access the underlying monaco editor and apis. Reason behind...

Never looked in to it, good to know how it works.

---

<div class="post-metadata">

**Author:** ![TechAkayy](https://avatars.discourse-cdn.com/v4/letter/t/ce73a5/32.png) [@TechAkayy](https://forum.pinegrow.com/u/TechAkayy)\
**Post date:** [February 1, 2021, 11:04am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/17 "2021-02-01T11:04:49Z")

</div>

@ehigiepaul, do you have an ETA on when we can expect your plugin release?

---

<div class="post-metadata">

**Author:** ![ehigiepaul](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/ehigiepaul/32/2339_2.png) [@ehigiepaul](https://forum.pinegrow.com/u/ehigiepaul)\
**Post date:** [February 1, 2021, 11:22am UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/18 "2021-02-01T11:22:20Z")

</div>

Hopefully between 14 days from now of vals day🤣. I just need to get the terminal working.

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [February 1, 2021, 1:13pm UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/19 "2021-02-01T13:13:17Z")

</div>

Impressive dude… Looks like @RobM might be having some dev head company around the team to bounce ideas off.

Great. good luck.  
Anyone contributing anything to PG for the benefit of both themselves and others is just fab.

---

<div class="post-metadata">

**Author:** ![ehigiepaul](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/ehigiepaul/32/2339_2.png) [@ehigiepaul](https://forum.pinegrow.com/u/ehigiepaul)\
**Post date:** [February 2, 2021, 8:11pm UTC](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913/20 "2021-02-02T20:11:13Z")

</div>

**Terminal is set and ready with php language support** 🎉🎉🎉🎉 @AllMediaLab@TechAkayy

 ![dockable terminal](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/8/896773767762e54312bc3f4bf7c68237592f44ac.png)  
Dockable terminal

 ![Terminal Pg](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/0/0d21cc5b94ef4943348a8605f1de8ce4415c4a92.png)  
Integrated terminal

[Next page](https://forum.pinegrow.com/t/pgmonaco-monaco-editor-for-pg/4913.md?page=2)
