因为某些原因，要在 html 文件中，使用自己定义的组件。而且服务端不是 node.js
目前知道 html 引入 vue 组件的方法是在 js 文件里，写组件，但 js 里使用 es6 的字符串语法，会使编译器（比如 vscode ）对 es6 的字符串里的模板 html 标签语法和颜色不提示，这样的情况下对组件模板，编写起来比较麻烦。
对于这种情况下封装 vue 组件，有什么好方法吗？难道用后端的模板引擎？
› Vue.js
This topic created in 1919 days ago, the information mentioned may be changed or developed.
 |
catinsidesAug 3, 2021
1
vscode 里可以用 Vetur
|
 |
nervdyAug 3, 2021
2
https://cli.vuejs.org/zh/guide/build-targets.html#web-components-%E7%BB%84%E4%BB%B6
直接写单文件组件，然后构建成库或者 WC |
 |
toesbieyaAug 3, 2021
3
http-vue-loader 、组件打包成 umd 、起一个用于解析组件的 node 服务
|
 |
initdAug 3, 2021
4
vue 作为运行时框架， 只要浏览器支持 ES6 就可以运行 vue 3.0 版本，不支持 ES6 的可以使用 vue 2 。
vscode webstorm 都有插件支持。 建议认真学习一下 vue 组件， 真要是项目内大量使用 vue 组件， 可以构建一个组件库，可以参考 element plus 。 构建完成 其实也不需要 build， 写好的 vue 文件已经是组件了。可以写个 index.js 导出一下。之后导入 webstorm 有自动补全。 |
|
initdAug 3, 2021
5
需要 服务器端渲染， 直接访问单页应用 vue 路由 path，动态 static 文件，服务器请求数据库 等场景才需要用到 node 服务器。而其中又有相当一部分可以选择 go 做后端实现更好的性能，强类型。实在不行 iframe，
|
 |
TwinkleAug 3, 2021
6
|
 |
codingguyAug 3, 2021
7
模板写在 html 的 <script type="text/plain" id="id-1"></script> 里。然后组件的 html 就拿 id-1 里的 text
|
 |
10
@codingguy 那这样会模板内容和页面混在一起。这样组件就和 html 绑定在一起了，我想能不能独立出来，至少非业务组件的代码内容不要在业务页面里，
或者你的意思是用类似原生的 html 组件的方式？把组件 js 代码和组件模板文件放到一个 html 文件里，然后用类似 link，scirpt 标签额度方式引入？ |
Select Language