fredemagi's avatar

Transpile CKEditor to ES5 using Webpack/Laravel mix

In order to get CKEditor to work on previous versions of Safari in iOS 10, I was recommended to transpile CKEditor to ES5 using their guide: https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/advanced-setup.html#option-building-to-es5-target

However, when I need to add

module: {
    rules: [
        {
            test: /ckeditor5-[^\/\]+[\/\].*\.js$/,
            use: [
                {
                    loader: 'babel-loader',
                    options: {
                        presets: [ require( '@babel/preset-env' ) ]
                    }
                }
            ]
        },
        ...
    ]
}

to webpack.mix.js, I'm not sure about the syntax. The same goes for

entry: [
    require.resolve( 'regenerator-runtime/runtime.js' )
]

Any help is appreciated.

0 likes
3 replies
artcore's avatar

The following may not help you but I quit webpack over parcel https://parceljs.org/getting_started.html Virtually zero config, just point and shoot. I'm creating gzipped assets from my dev in node and use these as production. Works great

Here's an example of my package.json The browserlist option takes care of all. Note that this setup also has treeshaking.

{
  "name": "collection",
  "version": "1.0.0",
  "private": true,
  "description": "Display and filter data",
  "repository": {},
  "browserslist": [
    "last 2 versions",
    "> 1%",
    "not ie <= 8"
  ],
  "main": "../../../index.js",
  "scripts": {
    "dev": "parcel *.js",
    "build-collection": "parcel build *.js --no-source-maps --experimental-scope-hoisting",
    "watch-collection": "parcel watch *.js --no-source-maps"
  },
  "keywords": [],
  "author": ",
  "license": "ISC",
  "dependencies": {},
  "devDependencies": {
    "parcel-plugin-compress": "^1.0.9"
  },
  "compress": {
    "brotli": {
      "enabled": false
    }
  }
}

Please or to participate in this conversation.