随着前端技术的发展，vue.js 成为了很多人心中最喜欢的前端框架之一。虽然在 vue cli 中创建和部署 vue 应用程序很容易，但在浏览器中运行 vue 项目也是有可能的。在本文中，我将向您介绍一些方法，以便在浏览器中运行 vue 项目。
第一种方法：使用 CDN
CDN 是内容分发网络的缩写，是一种通过将内容分发到各个服务器来提供更快速、可靠的互联网服务的技术。如果您只是想在浏览器中查看 Vue 的演示页面或学习 Vue，那么使用 CDN 是最简单的方法。
Vue.js 的官方网站中提供了使用 CDN 的方式。您只需要复制以下代码，粘贴到您的 HTML 文件中，即可快速引用 Vue.js：
值得注意的是，Vue.js 将被存储在全局变量 Vue 中。因此，在应用程序中不需要通过导入或 require 方法进行引入。
第二种方法：使用本地 Vue.js 引用
如果您想要在浏览器中运行的 Vue 项目不是来自于 Vue CLI，那么您可以在本地引用 Vue.js 的方式。您可以在 index.html 文件中添加以下代码来引入本地 Vue.js 文件：
立即学习“前端免费学习笔记（深入）”；
这里的 ./path/to/vue.js 是指代 Vue.js 文件所在的本地路径。
里面有2个文件夹。其中这个文件名是:finishing，是我项目还没有请求后台的数据的模拟写法。请求后台数据之后，瀑布流的js有一点点变化，放在文件名是：finished。变化在于需要穿参数到后台，和填充的内容都用后台的数据填充。看自己项目需求来。由于chrome模拟器是不允许读取本地文件json的，所以如果你要进行测试，在hbuilder打开项目就可以看到效果啦，或者是火狐浏览器。
第三种方法：使用 Vue devtools
Vue.devtools 是一个 Chrome 扩展程序，允许您在浏览器中进行开发和调试 Vue 应用程序。Vue.devtools 包含了许多特性，包括允许您查看 Vue 组件的层次结构、检查组件数据的变化和性能剖析。
要使用 Vue.devtools，您需要完成以下操作：
- 在 Chrome 浏览器中搜索和下载 Vue.devtools 扩展程序
- 将 Vue.js 引入您的项目
- 在开发阶段使用 Vue.devtools 查看您的应用程序
Vue.devtools 非常易于使用，只需在浏览器的开发者控制台中启用即可。
总结
在本文中，我向您介绍了三种在浏览器中运行 Vue 项目的方法：使用 CDN、使用本地 Vue.js 引用和使用 Vue.devtools。尽管这些方法在不同的场合中都有其各自的用途，但都是非常方便的。如果您是一个 Vue.js 开发者，那么您可以使用这些方法来帮助您更加便捷地开发和调试您的应用程序。
