Javascript 将html和css捆绑在一起发送到服务器_Javascript_Html_Css_Webpack_Vue.js

Javascript 将html和css捆绑在一起发送到服务器

javascript html css webpack vue.js

Javascript 将html和css捆绑在一起发送到服务器,javascript,html,css,webpack,vue.js,Javascript,Html,Css,Webpack,Vue.js,我正在做一个简单的web应用程序，我正在使用一个名为（html到pdf）的外部库。其想法是创建一个pdf，在前端生成html和css。lib接收一个html文档，因此我需要类似于以下表示的内容： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scal

我正在做一个简单的web应用程序，我正在使用一个名为（html到pdf）的外部库。其想法是创建一个pdf，在前端生成html和css。lib接收一个html文档，因此我需要类似于以下表示的内容：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>cv-maker</title>
  </head>

 <style>
  styles go here
 </style>
  <body>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
</html>


cv生成器
风格就在这里

目前，我正在使用vue来完成这项工作，因为它让我与其他东西的接触更少。我需要的是转换基于组件的模板，如下所示：

<template>
  <div class="wrapper">
    <button @click="sendRequest()"></button>
  </div>
</template>

对于上面的示例，我可以提取特定组件的组件样式和生成的html，有什么方法可以做到这一点吗

目前我正在考虑webpack插件，但我不想每次向服务器发出请求时都构建我的包，这是一个好方法吗

编辑：恢复我想要的行为，基本上我想要用类包装器提取html在模板中，并获取当前组件上的样式，并使用从组件中提取的html和嵌入在带有样式标记的组件上的样式创建单个html文件

谢谢

在发送css之前，您不能使用添加css到HTML吗？ofc我可以，但它仍然是一个基于组件的模板，我可以将带有id的特定HTML添加到根目录，但是我如何添加样式标记？只是为了确保我理解正确。您的div

wrapper

（在模板中）具有所有HTML（是否有效HTML？），css位于外部文件中。在转换之前，也许您可以发送一个示例，说明您的

中包含的内容，这将帮助我更好地理解我编辑的问题，基本上我想提取模板中的html，并创建我自己的index.html文件，其中包含模板数据和当前组件上的样式，因为它是单个文件组件。该index.html文件应发送到外部库可以处理它的服务器。模板中的html是完全有效的html（从

到

），还是仅为其一部分？