vue3 tinymce content_css 引入样式 pubilc 中的 css 样式，但运行后得到的样式路径 file://localhost/css.css 错误

在Vue 3中，Tinymce是一个富文本编辑器，`content_css`属性用于指定编辑器内部使用的CSS文件。当你尝试从`public`目录下的静态资源导入CSS，并设置为`content_css`，在本地开发环境下，可能会遇到`file://localhost/css.css`这样的错误路径。

这是因为浏览器对`file:`协议的跨域策略限制了直接访问本地文件系统的资源。要在Vue项目中解决这个问题，你可以考虑以下几个方案：

1. **打包到dist**: 首先，在构建应用时，将`public`目录下的CSS文件复制到`dist`目录中，然后通过相对路径引用`dist`下的CSS文件。例如：

   <script setup>
     import YourCSS from '@/dist/css/your-style.css';
     window.TinyMCE.init({
       // ...
       content_css: document.createElement('link').href(YourCSS).toString(),
       // ...
     });
   </script>

2. **使用Webpack处理**：如果是在开发阶段，可以使用Webpack的`file-loader`来处理`content_css`，它会在构建时自动转换为正确的URL格式。配置webpack.config.js里的`module.rules`部分：

   {
     test: /\.css$/,
     use: ['style-loader', 'css-loader'],
     include: path.resolve(__dirname, 'public'),
   }

3. **修改TinyMCE配置**：如果你不想改变项目结构，可以在TinyMce初始化时，使用`url()`函数生成一个相对或绝对URL。但这会绕过浏览器的安全策略，可能导致某些功能受限。

记得在部署生产环境时，确保正确处理路径，通常是使用服务器地址而不是`file://`。