Javascript 使用ES6，将tinymce作为npm包导入

我已经在我的项目中使用安装了tinymce作为包

我正在尝试将tinymce导入到我的项目中。当我调用

init（）

时，它会做一些事情（隐藏我的

textarea

，预期行为），但它不会显示所见即所得编辑器

如果我在html文件中包含url，它会工作，但这不是我想要的，因为我不会在每次加载页面时都包含自定义组件。对于某些用户来说，脚本标记可能过于苛刻

---

我想像这样导入tinymce（或simular）：

然后像这样使用它：

constructor(){
  tinymce.init({
    selector: "#mytextarea"
  })
}

这不会给我任何错误，它会隐藏textarea，但不会构建所见即所得编辑器

---

目前唯一有效的方法是：

<script src="/path/to/tinymce.min.js"></script>

---

我不喜欢编辑JavaScript文件，因为这样会在更新时中断。如果这是唯一的办法，我就不得不这么做

---

如何将库导入ES6模块？

您可以按照以下链接中提到的步骤操作

但您可能仍然需要做一些css更改，因为没有加载皮肤

跑 npm i url加载程序--保存

在网页包配置文件中添加此

---

{loader:'url loader？limit=100000'，test:/（png | woff | woff2 | eot | ttf | svg | gif）$/}

这里有一个更为最新的官方文档，描述了如何直接从npm使用tinymce，而无需捆绑，并设置路径：

就我而言：

tinymce.init({
  selector: '.editor', 
  skin_url: '/node_modules/tinymce/skins/ui/oxide',
});

虽然这是可行的，但他们似乎并没有优先考虑这一点，因为它仍然试图从另一个路径加载一些css

---

此外，您还可以为tinymce-i18n软件包提供语言url。官方文档指出，皮肤文件应复制到公共web文件夹中的相对文件夹“皮肤”：

在Linux中，您可以通过执行以下操作来解决此问题

cp -r node_modules/tinymce/skins skins

但如果您使用的是，请将以下内容添加到webpack.config.js中的Encore对象中：

这将在构建资源时将所有文件从node_modules/tinymce/skins文件夹复制到公共文件夹“skins”中

---

有了这个，我假设文件夹节点_modules/tinymce/skins相对于webpack.config.js文件存在。

Hi randy，这可能在回答中很有用。您在github中有一个项目，有一个工作示例。我已经设置好了所有内容，可以工作，不需要将任何内容从es6传输到es5，因为这已经发生了。这里唯一的问题是导入的行为与使用

标记时不同。@randy对此问题有任何解决办法。@Karthigeyan没有，还不清楚。老实说，我放弃了。试试这个链接吧，它能用

cp -r node_modules/tinymce/skins skins

.copyFiles({
    from: './node_modules/tinymce/skins',
    to: 'skins/[path][name].[ext]'
})