问题 #2428💬 已回答提出于 2019年11月25日作者 aarangara0 个反应

:使用webpack时字体无法加载——grapesjs试图加载具有相对路径的字体

快速解答作者 artf

,也就是说HTML文件在/public/editor/demo.html,webpack输出的文件是/public/js/(bundle.js和字体文件)——所以如果我把字体文件复制到/public/editor/fonts/,就能正常工作。 我觉得从这句话来看很明显,问题出在webpack放置字体的位置(可能你只需要正确配置'file-loader')。

阅读下方完整回答 ↓

问题

我正在尝试在一个简单的HTML文件中加载Grapesjs编辑器,但它无法加载Grapesjs自身的图标或fontawesome图标。 我查阅了这两个问题 [#2320](https://github.com/artf/grapesjs/issues/2320)和 [#1474](https://github.com/artf/grapesjs/issues/1474),但它们并没有帮我解决问题,所以我才提出来。 下面是我的源脚本(“demo.js”),然后被webpack用来打包成“bundle.js” 我的webpack配置如下: 我看到当我运行webpack捆绑所有内容时,它会生成“bundle.js”“字体文件,同时输出主图标和fontawesome图标的字体文件”.woff“、”.svg“等。 但当我尝试在 HTML 中使用它们时,加载图标时总是返回错误:“可下载字体:下载失败.........来源:http://localhost/editor/fonts/fontawesome-webfont.woff2 我注意到一个有趣的现象是,如果我把字体复制粘贴到我编辑器HTML所在的同一个目录里,字体加载会正常 也就是说,html 文件在 ''/public/editor/demo.html',webpack 输出的文件是 ''/public/js/(bundle.js 和...

回答(1)

artf2019年11月29日

,也就是说HTML文件在/public/editor/demo.html,webpack输出的文件是/public/js/(bundle.js和字体文件)——所以如果我把字体文件复制到/public/editor/fonts/,就能正常工作。

我觉得从这句话来看很明显,问题出在webpack放置字体的位置(可能你只需要正确配置'file-loader')。

相关问答

通过相似的问题讨论继续研究。

与此问题匹配的付费插件

根据问题关键词和标签相关性精选,助你更快交付。

查看全部插件

正在加载付费插件推荐……

免费方案

在以下平台查看开源 GrapesJS 插件: GitHub 或在我们的免费目录中快速搜索。

浏览免费插件 →
高级方案

高级插件提供支持、定期更新和生产就绪的功能——为你节省数天的集成工作。

浏览高级插件 →

浏览插件分类

直接跳转到市场上的插件分类页面。