#46 Convert to DLL compatible plugin #83

DanielKulbe · 2023-02-06T18:42:07Z

DLL compatible plugin build process
Fix some deprecations
Update docs

closes #46

tony · 2023-02-07T10:54:02Z

Wow! This is impressive!

cc'ing @isaul32 as well

isaul32 · 2023-02-07T14:43:02Z

This is a awesome feature. Could you @tony do the merge and release? Thanks very much.

tony · 2023-02-07T14:58:46Z

@isaul32 Sounds good. I will look at it this weekend (or next weekend if this one is busy)

tony · 2023-02-14T23:40:31Z

@DanielKulbe This will need another rebase (smaller bugfix to master)

tony · 2023-02-18T11:49:20Z

@DanielKulbe Give this a rebase?

tony · 2023-02-18T20:45:55Z

@DanielKulbe This is very good. wow!

Some issues we need to look at, consider the following diff:

Assuming yarn start:

index.html

http://localhost:8080/

diff --git a/sample/index.html b/sample/index.html
index 8ef5e67..1b26c5a 100644
--- a/sample/index.html
+++ b/sample/index.html
@@ -30,6 +30,19 @@
 <h1>CKEditor 5 with ckeditor5-math – Development Sample</h1>

 <div id="editor">
+ <h2>The <code>Math</code> plugin <h2>
+    <p>
+        <code>Math</code> inserts mathematical formulas into the editor. You can click the CKEditor 5 Math icon in the toolbar and see the results.
+    </p>
+    <p><script type="math/tex">e=mc^2</script></p>
+    <p><script type="math/tex; mode=display">e=mc^2</script></p>
+    <p>
+       This should show "\test" as ≠ via katexRenderOptions.macros:
+       <script type="math/tex">\test</script>
+    </p>
+    <!-- Quill Style Tag -->
+    <p><span class="ql-formula" data-value="e=mc^2"></span></p>
+
     <h2>Development environment</h2>
     <p>
         This is a demo of the <a href="https://ckeditor.com/docs/ckeditor5/latest/builds/guides/overview.html#classic-editor">classic editor build</a> that loads the <code>Math</code> and <code>AutoformatMath</code> plugin.

The formulas don't display in the editor itself:

Preview works!

dll.html

No editor showing for DLL builds

http://localhost:8080/dll.html

15Refused to execute script from '<URL>' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.
dll.html:70 Uncaught ReferenceError: CKEditor5 is not defined
    at dll.html:70:56

DanielKulbe · 2023-02-21T07:13:19Z

Sorry, just had have time today to rebase.

Also addressed the issues above, But for the last one, I'm not sure what's happening on your end, because it just renders fine on my end:

tony · 2023-03-02T17:58:05Z

@DanielKulbe Thank you for the rebase and checking!

Sorry about this: I still can't get http://localhost:8080/dll.html to work

I wiped node_modules/ and did yarn && yarn + yarn start

Uncaught Error: No element provided to render
    at s (auto-render.min.js:1:2575)
    at HTMLScriptElement.onload (dll.html:23:6)
15Refused to execute script from '<URL>' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.
dll.html:68 Uncaught ReferenceError: CKEditor5 is not def

This is on:

node --version
v19.6.0

Is anyone else watching this getting http://localhost:8080/dll.html to work?

The main build at http://localhost:8080/ works fine.

Wigny · 2023-03-02T18:54:44Z

I don't know if that is the expected command to be run, but for me, just running yarn dll:build and later yarn dll:serve serves the DLL sample at http://127.0.0.1:8080/sample/dll.html as wanted...

Wigny · 2023-03-02T19:00:08Z

sample/dll.html

+    <script
+        src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js"


About the Uncaught Error: No element provided to render error that happens with Katex, I think it can be solved just by adding the defer attr to the script as described in the doc.

Suggested change

<script

src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js"

<script

defer

src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js"

I had to remove this to prevent load errors first reported.

But, hey ... feel free to try and report anything that works - I'm not really familiar with Katex, as I am using MathJax in my project.

Wigny · 2023-03-06T18:07:43Z

@isaul32, what is missing for we have this PR merged? Looking forward to using it on my projects...

ghalestrilo · 2023-03-06T20:33:22Z

I have to second what @Wigny said. Our CKEditor integration at work will be so much simpler once this is merged 🥲
@tony can I kindly ask you to check this MR again? Thank you for your time.

tony · 2023-03-06T21:14:06Z

@ghalestrilo @Wigny @DanielKulbe I will try again tonight

tony · 2023-03-06T23:27:04Z

@ghalestrilo @Wigny Can you make a video of what steps you're taking to install + build and show what http://localhost:8080/dll.html looks like?

Screenshot w/ inspector

This still doesn't work for me 🤷.

Wigny · 2023-03-07T15:19:56Z

@tony, here are my steps.

I think our different outputs on it are about the commands being run to serve the DLL sample page (as I think you are just running yarn serve). I don't think ckeditor5-package-tools start does the work, so I'm testing with yarn dll:serve instead... @DanielKulbe, can you please confirm which commands should be run to test the DLL build? Moreover, I think would be nice having these steps documented in the README for help in future contributions.

Desktop.2023.03.07.-.11.13.55.04.mp4

DanielKulbe · 2023-03-08T06:33:40Z

Yes, as you statet it some comments above:

I don't know if that is the expected command to be run, but for me, just running yarn dll:build and later yarn dll:serve serves the DLL sample at http://127.0.0.1:8080/sample/dll.html as wanted...

The whole process is already documented with the CKEditor package generator, I believe:
https://ckeditor.com/docs/ckeditor5/latest/framework/plugins/package-generator/javascript-package.html

tony · 2023-03-13T19:58:55Z

yarn dll:serve

@Wigny Thank you, the approach here does work for me.

What didn't work was yarn start with http://127.0.0.1:8080/dll.html

http://localhost:8080/node_modules/ckeditor5/build/ckeditor5-dll.js returns Cannot GET /node_modules/ckeditor5/build/ckeditor5-dll.js
What did work was yarn dll:serve with http://127.0.0.1:8080/sample/dll.html

tony

@DanielKulbe Approved

Tested locally with yarn dll:serve and yarn start
Tested on a separate build

Well done, this is awesome

tony · 2023-03-14T00:43:27Z

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "ckeditor5-math",
+  "name": "@isaul32/ckeditor5-math",


@DanielKulbe I did find a minor issue here.

The npm package is ckeditor5-math

When corrected, it raises:

$ yarn run dll:build yarn run v1.22.19 $ ckeditor5-package-tools dll:build ckeditor5-math/node_modules/@ckeditor/ckeditor5-package-tools/lib/utils/get-webpack-config-dll.js:23 const dllName = packageJson.name.split( '/' )[ 1 ].replace( /^ckeditor5-/, '' );

I filed an issue at ckeditor/ckeditor5-package-generator#139

100% an oversight by me 😆 Who would have thought an ordinary NPM package name would raise an error

tony · 2023-03-14T00:53:29Z

@isaul32 Are you okay with giving me publish access to @isaul32/ckeditor5-math on npm until ckeditor/ckeditor5-package-generator#139 is handled?

This was a mistake on my part - it flew right past me in the review, I didn't expect it'd error with our normal package name.

isaul32 · 2023-03-14T11:32:37Z

I'm okay with that. Do I have to do something?

tony · 2023-03-14T11:35:33Z

@isaul32 Yes, if you git pull master at 406aa5c, then run yarn, and yarn publish --access public - that should be enough to publish the NPM package to @isaul32/ckeditor5-math.

If that works - can you add me as a maintainer to the NPM package?

isaul32 · 2023-03-14T11:53:17Z

I can do it this evening. I think you are already a maintainer of the NPM package.

tony · 2023-03-14T12:58:12Z

@isaul32/ckeditor5-math doesn't exist yet - that's where the package will be published
ckeditor5-math does exist, but can't be published due to DLLs: Allow normal package names ckeditor/ckeditor5-package-generator#139

Thank you, you will be able to see this evening

isaul32 · 2023-03-14T21:08:32Z

Done. I also invited you @tony again. https://www.npmjs.com/package/@isaul32/ckeditor5-math

tony · 2023-03-14T21:09:22Z

@isaul32 Thank you!

tony · 2023-03-14T22:56:02Z

@isaul32 Do you want to push the package.json with v36.0.4 to the git repo?

DanielKulbe force-pushed the ckeditor-dll-build branch from a435ce3 to 457ee76 Compare February 7, 2023 11:42

tony mentioned this pull request Feb 9, 2023

Development environment? (e.g. yarn start + file watch for changes?) #37

Closed

DanielKulbe added 3 commits February 21, 2023 07:49

Convert to DLL compatible plugin (isaul32#46)

b2ed752

Add examples to index.html

11314b2

Fix math not rendered at editor startup

da9ca15

DanielKulbe force-pushed the ckeditor-dll-build branch from 457ee76 to da9ca15 Compare February 21, 2023 07:10

Wigny reviewed Mar 2, 2023

View reviewed changes

tony self-requested a review March 14, 2023 00:29

tony approved these changes Mar 14, 2023

View reviewed changes

tony merged commit 4d5b935 into isaul32:master Mar 14, 2023

tony added a commit to tony/ckeditor5-math that referenced this pull request Mar 14, 2023

package: Release v36.0.3 (with DLL build from isaul32#83)

74eb381

tony mentioned this pull request Mar 14, 2023

package: Release v36.0.3 #88

Merged

tony added a commit that referenced this pull request Mar 14, 2023

package: Release v36.0.3 (with DLL build from #83)

819b55c

tony reviewed Mar 14, 2023

View reviewed changes

DanielKulbe deleted the ckeditor-dll-build branch March 23, 2023 07:07

tony mentioned this pull request Mar 17, 2024

docs(README): Note TypeScript and DLL-build support #133

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

#46 Convert to DLL compatible plugin #83

#46 Convert to DLL compatible plugin #83

DanielKulbe commented Feb 6, 2023

tony commented Feb 7, 2023

isaul32 commented Feb 7, 2023

tony commented Feb 7, 2023

tony commented Feb 14, 2023

tony commented Feb 18, 2023

tony commented Feb 18, 2023

DanielKulbe commented Feb 21, 2023

tony commented Mar 2, 2023

Wigny commented Mar 2, 2023

Wigny Mar 2, 2023

DanielKulbe Mar 3, 2023

DanielKulbe Mar 3, 2023

Wigny commented Mar 6, 2023

ghalestrilo commented Mar 6, 2023

tony commented Mar 6, 2023

tony commented Mar 6, 2023

Wigny commented Mar 7, 2023

DanielKulbe commented Mar 8, 2023

tony commented Mar 13, 2023

tony left a comment

tony Mar 14, 2023

tony Mar 14, 2023

tony Mar 14, 2023

tony commented Mar 14, 2023

isaul32 commented Mar 14, 2023

tony commented Mar 14, 2023

isaul32 commented Mar 14, 2023

tony commented Mar 14, 2023

isaul32 commented Mar 14, 2023

tony commented Mar 14, 2023

tony commented Mar 14, 2023 •

edited

Loading

		<script
		src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js"

#46 Convert to DLL compatible plugin #83

#46 Convert to DLL compatible plugin #83

Conversation

DanielKulbe commented Feb 6, 2023

tony commented Feb 7, 2023

isaul32 commented Feb 7, 2023

tony commented Feb 7, 2023

tony commented Feb 14, 2023

tony commented Feb 18, 2023

tony commented Feb 18, 2023

index.html

dll.html

DanielKulbe commented Feb 21, 2023

tony commented Mar 2, 2023

Wigny commented Mar 2, 2023

Wigny Mar 2, 2023

Choose a reason for hiding this comment

DanielKulbe Mar 3, 2023

Choose a reason for hiding this comment

DanielKulbe Mar 3, 2023

Choose a reason for hiding this comment

Wigny commented Mar 6, 2023

ghalestrilo commented Mar 6, 2023

tony commented Mar 6, 2023

tony commented Mar 6, 2023

Wigny commented Mar 7, 2023

DanielKulbe commented Mar 8, 2023

tony commented Mar 13, 2023

tony left a comment

Choose a reason for hiding this comment

tony Mar 14, 2023

Choose a reason for hiding this comment

tony Mar 14, 2023

Choose a reason for hiding this comment

tony Mar 14, 2023

Choose a reason for hiding this comment

tony commented Mar 14, 2023

isaul32 commented Mar 14, 2023

tony commented Mar 14, 2023

isaul32 commented Mar 14, 2023

tony commented Mar 14, 2023

isaul32 commented Mar 14, 2023

tony commented Mar 14, 2023

tony commented Mar 14, 2023 • edited Loading

tony commented Mar 14, 2023 •

edited

Loading