Cannot use minified library written ES6 in RCA
See original GitHub issueIs this a bug report?
Yes.
Did you try recovering your dependencies?
Yes.
Which terms did you search for in User Guide?
I didn’t find anything that could help me. I was searching for something that allows me to disable transpiling a library that was written ES6 and also minified.
Environment
node -v
v10.11.0
npm -v
6.4.1
Steps to Reproduce
Clone a demo (on the bottom of this comment) or follow steps listed below:
- Create an example app:
npx create-react-app my-app
- Install CKEditor 5 dependencies:
npm install @ckeditor/ckeditor5-react @ckeditor/ckeditor5-build-classic
- Replace
src/App.js
with:
import React, { Component } from 'react';
import CKEditor from '@ckeditor/ckeditor5-react';
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
import './App.css';
class App extends Component {
render() {
return (
<div className="App">
<CKEditor
editor={ClassicEditor}
data="<p>Hello from CKEditor 5!</p>"
onInit={editor => {
// You can store the "editor" and use when it's needed.
console.log( 'Editor is ready to use!', editor );
}}
onChange={( event, editor ) => {
const data = editor.getData();
console.log( { event, editor, data } );
}}
/>
</div>
);
}
}
export default App;
npm start
Expected Behavior
The application works, the dev-tools console does not contain any error.
Actual Behavior
A blank page and the following error in the console.
Additional informations
I wanted to check whether it will work if ckeditor5-build-classic
won’t be minified so I did steps specified below:
- Go to
@ckeditor
namespace in dependencies:cd node_modules/@ckeditor
- Remove
ckeditor5-build-classic
installed from npm:rm -r ckeditor5-build-classic
- Clone package from GitHub and check out to the proper version:
git clone -b v11.1.0 git@github.com:ckeditor/ckeditor5-build-classic.git
- Go to the package and install dependencies:
cd ckeditor5-build-classic && npm i
- Build the package in development mode:
./node_modules/.bin/webpack --mode development
- Go back to your application and call
npm start
again.
It works!
The question is - why doesn’t minified build work?
Reproducible Demo
Issue Analytics
- State:
- Created 5 years ago
- Reactions:12
- Comments:6
Top Results From Across the Web
Failed to minify the code from this file - Stack Overflow
I have already tried publishing my library using ES6 export / import commands. The full source code of my library (it's just these...
Read more >Let's Write a JavaScript Library in ES6 using Webpack and ...
In this blog we will learn how to create our own webpack configuration to bundle a small JavaScript utility library using webpack and...
Read more >cinos81/rca - Docker Image | Docker Hub
Builds the app for production to the build folder. It correctly bundles React in production mode and optimizes the build for the best...
Read more >How to use an ES6 import in Node.js? - GeeksforGeeks
In the package.json file add “type” : “module”. Adding this enables ES6 modules. The package.json file should look like this:.
Read more >How to write and build JS libraries in 2018 - Medium
Use ES6 modules and don't care about. Don't build it. Webpack will do all work for you. Just besure that all external dependencies...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
The another possible temporary approach with avoiding the ejection of CRA is to use ClassicEditor as static asset (via script tag in index.html)
this works for me.