第一个Vue程序
提前要做的一件事：去网上下好Vue.js文件或者也可以直接通过cdn进行在线编程
第一步：启动IDEA，创建打开一个空的文件夹，并创建vue目录后如下图
第二步：在vue目录下创建一个名为demo01.html的静态文件，并编码如下
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <!-- 1、导入Vue.js --> 7 <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.js"></script> 8 </head> 9 <body> 10 <div id="app"> 11 <!-- 显示message中的内容 --> 12 {{message}} 13 </div> 14 15 <script type="text/javascript"> 16 let vue = new Vue({ 17 el: "#app", 18 data: { 19 // 给message属性赋值 20 message: "Hello Vue !!!" 21 } 22 });23 </script> 24 </body> 25 </html>
第三步：点击IDEA中的任意一个浏览器图标，我这里通过火狐打开，运行效果如下
到此，我们的第一个Vue程序就结束了。
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列：如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列（二）：开始使用ML.NET
· 没有Manus邀请码？试试免邀请码的MGX或者开源的OpenManus吧
· 无需6万激活码！GitHub神秘组织3小时极速复刻Manus，手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· DeepSeek在M芯片Mac上本地化部署
· 葡萄城 AI 搜索升级：DeepSeek 加持，客户体验更智能