vue 项目中引入 本地html文件

在Vue项目中引入本地HTML文件，可以通过以下步骤实现：

1. 将HTML文件放置在Vue项目的public或static文件夹中（通常是public）。
2. 在Vue组件中，使用<iframe>标签或者Vue的v-html指令来引入并显示HTML内容。

以下是一个使用<iframe>的例子：

<template>
  <div>
    <iframe src="/local-html-file.html" width="100%" height="500px"></iframe>
  </div>
</template>

如果你想使用v-html指令，首先需要将HTML文件通过Webpack的raw-loader或者html-loader加载进来，然后将加载的内容绑定到v-html指令上。

例子：

1. 安装所需的loader：

npm install --save-dev raw-loader

2. 在Vue组件中使用v-html指令：

<template>
  <div v-html="htmlContent"></div>
</template>
 
<script>
import htmlContent from '@/assets/local-html-file.html';
 
export default {
  data() {
    return {
      htmlContent: htmlContent
    };
  }
};
</script>

3. 在src/assets目录下放置你的local-html-file.html文件。

请注意，使用v-html时要确保内容是可信的，因为它会将内容作为HTML渲染，如果内容包含恶意脚本，可能会有安全风险。