CKEditor:[CKEditorWebpackPlugin]错误:在编译过程中发现了太多JS资产

Question

我正在将Rails/React应用程序中的CKEditor包从12更新到最新版本27。当在我的webpack-dev-server中本地运行应用程序时，我看到下面的错误消息，我不确定如何确定哪个选项是最佳/正确的？

[CKEditorWebpackPlugin] Error: Too many JS assets has been found during the compilation. You should use one of the following options to specify the strategy:
- use `addMainLanguageTranslationsToAllAssets` to add translations for the main language to all assets,
- use `buildAllTranslationsToSeparateFiles` to add translation files via `<script>` tags in HTML file,
- use `translationsOutputFile` to append translation to the existing file or create a new asset.For more details visit https://github.com/ckeditor/ckeditor5-dev/tree/master/packages/ckeditor5-dev-webpack-plugin.

---

environment.js文件当前如下所示：

const { environment } = require("@rails/webpacker")
const typescript = require("./loaders/typescript")
const GitRevisionPlugin = require("git-revision-webpack-plugin")
environment.loaders.append("typescript", typescript)
environment.plugins.prepend(
"Define",
new webpack.DefinePlugin({
// On Heroku git is not available, but SOURCE_VERSION is provided
GIT_VERSION: JSON.stringify(process.env.SOURCE_VERSION || new GitRevisionPlugin().commithash()),
BUILD_TIME: JSON.stringify(new Date().toISOString()),
})
)
environment.plugins.prepend(
"Provide",
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
jquery: "jquery",
"window.jQuery": "jquery",
})
)
environment.config.externals = ["cloudinary"]
// Add support for CKEditor 5.
const CKEditorWebpackPlugin = require("@ckeditor/ckeditor5-dev-webpack-plugin")
environment.plugins.prepend(
"CKEditor",
new CKEditorWebpackPlugin({
language: "en",
})
)
// Define custom loaders for CKEditor's SVG and CSS files.
environment.loaders.append("CKEditorSVGLoader", require("./loaders/ckeditor/svg"))
environment.loaders.append("CKEditorCSSLoader", require("./loaders/ckeditor/css"))
// Tell the standard CSS and file loaders to ignore CKEditor's CSS and SVG files. We have our own loaders for those.
environment.loaders.get("css").exclude = /(.module.[a-z]+$)|(ckeditor5-[^/\]+[/\]theme[/\].+.css)/
environment.loaders.get("file").exclude = /ckeditor5-[^/\]+[/\]theme[/\]icons[/\][^/\]+.svg$/
module.exports = environment

项目正在运行：

• ruby 2.6.6
• 轨道6.0.3.6
• webpack-dev服务器"：3.11.2

Answer 1

我在CKEditor中进行自定义构建时也遇到了这个问题。所以我假设您遵循了这些说明("Webpack Encore"部分(。

在这个解决方案中，我使用webpack.config.js配置文件(PHP设置使用Encore(。配置文件名可能会从一种语言更改为另一种语言。如果您不使用Encore(我建议使用它(，代码可能会有所不同，但逻辑是相同的

1.如果您的构建不需要翻译：

只需从webpack.config.js:中删除此部分

.addPlugin( new CKEditorWebpackPlugin( {
language: 'pl'
} ) )

2.如果您需要翻译：

添加addMainLanguageTranslationsToAllAssets选项并将其设置为true，如下所示：

.addPlugin( new CKEditorWebpackPlugin( {
language: 'pl',
addMainLanguageTranslationsToAllAssets: true
} ) )