This browser is no longer supported.
Upgrade to Microsoft Edge to take advantage of the latest features, security updates, and technical support.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(3.2, 66%, 10%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EVV%3C/text%3E%3C/svg%3E)
Hi!
I'm trying to hook "Word count and character count" in CKEditor: https://ckeditor.com/docs/ckeditor5/latest/features/word-count.html
Can you tell me how to import it to the page so that it starts working in code?
I tried to import in different ways, it does not work - various errors.
Maybe I'm doing something wrong?
Thanks!
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(211.20000000000002, 61%, 30%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EBS%3C/text%3E%3C/svg%3E)
Neither razor pages or views support JavaScript import commands.
You need to use the npm build tool of your choice to build a script file that is loaded via the script tag. The npm build should place the compiled script in the wwwroot folder.
you could use a content copy command in the project file to copy from the node modules location to wwwroot and use the script tag.
You could also use cdn for the script tag.
I made two variants. 1) Just through the cdn link. 2) Placed node_models folder in www.
<script src="@("https://cdn.jsdelivr.net/npm/@ckeditor/ckeditor5-word-count@39.0.0/src/index.min.js")"></script>
<script src="@("~/node_mudules/@ckeditor/ckeditor5-word-count/src/index.js")"></script>
I could do without this plugin at all if I knew how to accurately count the number of characters in the CKEditor field text (without html). Anyone knows how do I get whole text from html-body?
Tried getBody().getText(), innerHTML, outerHTML - do not work.
const parser = new DOMParser();
const doc = parser.parseFromString(editor, 'text/html');
console.log(doc);
console.log(doc.body.outerHTML);
console.log(doc.documentElement.innerHTML);
console.log(doc.documentElement.outerHTML);
console.log(doc.documentElement.textContent);
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(121.6, 59%, 21%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EA%3C/text%3E%3C/svg%3E)
Anyone knows how do I get whole text from html-body?
fetching the CKEditor contents was covered in your pervious thread.
Do a Google search to remove the HTML tags.
https://www.google.com/search?q=javascript+remove+html+tags+from+string
I learned how to extract html from CKEditor. But since I have not been able to install plugins, Now, I myself do the haunting of the number of characters (after html to text), and I do not need the counting of words.
But the question remains open, because no one has explained to me how to install plugins correctly so that net.core sees them in javascript.
npm install --save @ckeditor/ckeditor5-word-count
npm install html-to-text
Plugins make tasks easier, but for some reason I couldn't attach them to the project.
If anyone knows exactly how to attach them to net.core projects, please write.
On the Internet I found only fragmentary information and nothing concrete.
as I said, unless you are using a node build tool (say webpack), there is not support for node modules in your project. if you want to use npm packages, pick a build tool.
your other option is to build a custom script file with the desired plugs via the online builder. see:
https://ckeditor.com/ckeditor-5/online-builder/
note: by using a builder you can use js & css modules and support less or sass.