--aot is not working in angular 6, I can compile it but when I enter the app I get Uncaught ReferenceError: tinymce is not defined, execution of TinymceModule.withConfig() function inside app.module.ts might be the problem #65
Dependencies related to tinymce on my package.json:
"angular2-tinymce": "^3.0.0",
"tinymce": "^4.7.8"
Compiler is running but is not including tinymce and is failing silently since when I open the app on the browser in the console I can see the error tinymce is not defined, and the app doesn't start. The problem is that functions cannot be run in app.module.ts and we define config like this
TinymceModule.withConfig({
plugins: ['image', 'code'],
min_height:400,
file_picker_types: 'image',
file_picker_callback: filePickerCallback
})
export function filePickerCallback(cb, value, meta) {
var input = document.createElement('input') as HTMLInputElement;
input.setAttribute('type', 'file');
input.setAttribute('accept', 'image/*');
input.onchange = function() {
var res = <HTMLInputElement>this;
var file:File = res.files[0];
var reader = new FileReader();
reader.onload = function () {
var base64 = reader.result.split(',')[1];
// call the callback and populate the Title field with the file name
cb('data:image/png;base64,'+base64, { title: file.name });
};
reader.readAsDataURL(file);
};
input.click();
}
But the problem is that you cannot longer use function executions in app.module.ts, how do we workaround this problem???
EDIT: I'm not sure if that's the problem , it may not include the tinymce file properly for some reason
screenshot
https://postimg.cc/image/ptevjy1fx/
EDIT 2:
Adding tinymce to the scripts object in angular.json(this file is new in angular 6 and it replaces the old .angular-cli.json) seems to fix the issue
Dependencies related to tinymce on my package.json:
Compiler is running but is not including tinymce and is failing silently since when I open the app on the browser in the console I can see the error tinymce is not defined, and the app doesn't start. The problem is that functions cannot be run in app.module.ts and we define config like this
But the problem is that you cannot longer use function executions in app.module.ts, how do we workaround this problem???
EDIT: I'm not sure if that's the problem , it may not include the tinymce file properly for some reason screenshot https://postimg.cc/image/ptevjy1fx/
maybe a problem with the image plugin??
In the app.module.ts I'm importing it like
import 'tinymce/plugins/image/plugin.js';
in imports array
TinymceModule.withConfig({ plugins: ['image', 'code'], min_height:400, file_picker_types: 'image', file_picker_callback: filePickerCallback }),
EDIT 2: Adding tinymce to the scripts object in angular.json(this file is new in angular 6 and it replaces the old .angular-cli.json) seems to fix the issue
Alternatively adding it to the index.html(which is equivalent to the previous solution) fixes the issue as well
<script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.5.6/tinymce.min.js"></script>
The docs should be updated to reflect this since I couldn't find it there....