位置: IT常识 - 正文

用VSCode搭建Vue.js开发环境及Vue.js第一个应用(vscode搭建vue项目)

编辑:rootadmin
用VSCode搭建Vue.js开发环境及Vue.js第一个应用

目录

一、VSCode安装

二、VSCode简单配置

三、Vue.js的下载和引入

四、Vue.js第一个应用


一、VSCode安装

推荐整理分享用VSCode搭建Vue.js开发环境及Vue.js第一个应用(vscode搭建vue项目),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:vscode+vue,vscode如何创建vue文件,vscode如何运行vue代码,vscode如何运行vue代码,用vscode搭建后端环境,vscode使用教程vue,vscode搭建vue项目,用vscode搭建后端环境,内容如对您有帮助,希望把文章链接给更多的朋友!

        Visual Studio Code是一个轻量级但功能强大的源代码编辑器,可在您的桌面上运行,可用于Windows,macOS和Linux。它内置了对JavaScript,TypeScript和Node的支持.js并具有针对其他语言和运行时(如C++,C#,Java,Python,PHP,Go,.NET)的丰富扩展生态系统。

VSCode官网:

Visual Studio Code - Code Editing. Redefinedhttps://code.visualstudio.com/在官网选择自己电脑对应的操作系统进行安装

 选择我同意点击下一步

 

选择安装路径,建议安装在非C盘

默认下一步即可 

 

 

 安装中--

 

二、VSCode简单配置用VSCode搭建Vue.js开发环境及Vue.js第一个应用(vscode搭建vue项目)

在VSCode中安装这三个组件,第一个是汉化包,第二个是可以支持编写html和css的组件,第三个可是可在VSCode中直接打开浏览器的组件

然后选择对应的文件夹,就能编写对应的代码了!

三、Vue.js的下载和引入

Vue.js的下载引入有三种方法:

1、在vue官网下载独立版本直接引入

2、使用CDN引入Vue.js

3、使用node.js的npm安装Vue.js

在本篇博客直接使用第一种最简单的方法进行引入

Vue.js下载地址:

安装 — Vue.js (vuejs.org)https://v2.cn.vuejs.org/v2/guide/installation.html选择开发版本进行下载

        下载完成后把Vue.js复制粘贴到对应的路径中,我粘贴到了当前路径 ,在引入的时候就能直接用当前路径进行引入

四、Vue.js第一个应用

Vue.js应用的开发离不开Vue实例,第一个应用代码如下:

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <script src="vue-2.7.14.js"></script> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <div id="app"> <!--将msg的值绑定到p元素--> <p>{{msg}}</p > </div> <script> //创建vue实例 var vm=new Vue({ el:"#app", data:{ msg:"Hello Vue.js" } }) </script></body></html>

执行结果:

注意:Vue.js的核心允许采用简介的模板语法来

本文链接地址:https://www.jiuchutong.com/zhishi/299995.html 转载请保留说明!

上一篇:IDEA2022版本创建maven web项目(两种方式)(新版本idea怎么创建javaweb)

下一篇:JavaScript-匿名函数(js匿名函数和命名函数)

  • 联想电脑三种模式切换快捷键(联想电脑三种模式)

    联想电脑三种模式切换快捷键(联想电脑三种模式)

  • wps怎么做文档分享(wps文档怎么分类)

    wps怎么做文档分享(wps文档怎么分类)

  • 如何删除手机银行转账记录(如何删除手机银行卡号)

    如何删除手机银行转账记录(如何删除手机银行卡号)

  • 打印机老是用户干预(打印机老是用户名错误)

    打印机老是用户干预(打印机老是用户名错误)

  • 抖音粉丝怎么恢复(抖音粉丝怎么找回来)

    抖音粉丝怎么恢复(抖音粉丝怎么找回来)

  • ipx系列跟其他有什么区别(ipx和ipxr)

    ipx系列跟其他有什么区别(ipx和ipxr)

  • 京东怎么选择本地仓(京东怎么选择本地商家)

    京东怎么选择本地仓(京东怎么选择本地商家)

  • 抖音怎么和对方视频聊天(抖音怎么和对方连线)

    抖音怎么和对方视频聊天(抖音怎么和对方连线)

  • 缩略图可以删掉吗(缩略图文件怎么删除)

    缩略图可以删掉吗(缩略图文件怎么删除)

  • microsoft edge是ie浏览器吗

    microsoft edge是ie浏览器吗

  • 中国移动获得的5g频段是多少GHz(中国移动获得的5g试验频率资源中属于新增频段的有)

    中国移动获得的5g频段是多少GHz(中国移动获得的5g试验频率资源中属于新增频段的有)

  • 无线lan是什么(wifi的lan1)

    无线lan是什么(wifi的lan1)

  •  华为mate30怎么返回上一步(华为mate30怎么恢复出厂设置)

    华为mate30怎么返回上一步(华为mate30怎么恢复出厂设置)

  • 华为mate10充电变慢(华为mate10充电变慢原因)

    华为mate10充电变慢(华为mate10充电变慢原因)

  • 苹果手机没有4g网怎么回事显示E(苹果手机没有4g信号了怎么处理)

    苹果手机没有4g网怎么回事显示E(苹果手机没有4g信号了怎么处理)

  • 手机可以换内存卡吗(手机可以换内存大的卡吗)

    手机可以换内存卡吗(手机可以换内存大的卡吗)

  • 1000兆等于多少mb(网速1000兆等于多少mb)

    1000兆等于多少mb(网速1000兆等于多少mb)

  • 爱奇艺转播春晚吗(2021爱奇艺直播春晚)

    爱奇艺转播春晚吗(2021爱奇艺直播春晚)

  • 共享系统内存是什么意思(系统共享内存好不好)

    共享系统内存是什么意思(系统共享内存好不好)

  • 手机excel怎么求和(手机excel怎么求乘积一列)

    手机excel怎么求和(手机excel怎么求乘积一列)

  • 夸克链信怎么注销账号(夸克链信网页版登录)

    夸克链信怎么注销账号(夸克链信网页版登录)

  • ios13信号差解决办法(ios13.3信号不好)

    ios13信号差解决办法(ios13.3信号不好)

  • 京东怎么取消预约商品(京东怎么取消预购订单)

    京东怎么取消预约商品(京东怎么取消预购订单)

  • airpods会自动关机吗(airpods自动关机)

    airpods会自动关机吗(airpods自动关机)

  • 招贴设计和海报设计有何联系(招贴设计海报大师)

    招贴设计和海报设计有何联系(招贴设计海报大师)

  • 手机上怎么设置5g接入点(手机上怎么设置路由器无线网)

    手机上怎么设置5g接入点(手机上怎么设置路由器无线网)

  • win7卡在欢迎界面(win7卡在欢迎界面很久)

    win7卡在欢迎界面(win7卡在欢迎界面很久)

  • 百度翻译如何下载语音(百度翻译的发音怎样下载)

    百度翻译如何下载语音(百度翻译的发音怎样下载)

  • VoLTE是什么意思(未注册VoLTE是什么意思)

    VoLTE是什么意思(未注册VoLTE是什么意思)

  • 怎样去除快捷方式小箭头?(怎样去除快捷方式小箭头win10)

    怎样去除快捷方式小箭头?(怎样去除快捷方式小箭头win10)

  • 私车公用如何处理
  • 实质课税原则是税法基本原则吗
  • 用于维修安装服装的材料
  • 利润分配的规则
  • 商业承兑过期后多久失效
  • 一般纳税人用金蝶新建账套用什么会计制度好
  • 技术服务费怎么开票税率
  • 增值税抵扣凭证装订要求
  • 占用农村宅基地建豪宅
  • 员工借款可以直接转账吗
  • 不同税率的增值税如何报税
  • 购进二手办公设备如何进行入账?
  • 哪些费用可以计入待摊费用
  • 去年成立的公司今年需要年检吗
  • 《减免所得税优惠明细表》
  • 花椒油的税率
  • 个税申报表怎么打印
  • 当期应提取的坏账准备金
  • 怎么查询企业的注册资金
  • 查补的增值税如何申报
  • 上月留底的进项税额本月转出做什么分录
  • win10新建文件夹快捷键ctrl加什么
  • 企业收入确认的依据是什么
  • 冲销以前年度多做的其他应收款
  • 事假扣款进什么科目
  • linux测验
  • linux 速度
  • PHP:pg_num_fields()的用法_PostgreSQL函数
  • 存货损失的会计分录
  • 购入固定资产的会计处理
  • php数据导出到excel
  • php-mysql安装
  • 固定资产非正常损失
  • vue前端代码实例
  • vscode安装选项
  • tensorflow gan
  • php错误和异常
  • /f命令
  • 解决什么情况
  • 建筑业的印花税是按含税还是不含税?
  • 企业所得税能否票据入账
  • 外币应收账款汇兑损失计入
  • 银行存款利息的会计科目
  • 坏账损失的会计分录小企业会计准则
  • 全年一次性奖金并入或单独哪个好
  • 企业生产经营发展
  • 政府补助如何确定收入
  • 关联方交易金额达到多少算转移定价
  • 让渡资产使用权包括
  • 冲回多提的坏账准备会计分录
  • 无票收入的增值税税率
  • 个体工商户实收资本可以填0吗
  • 私立幼儿园规模标准
  • 搬迁赔偿款
  • 民间非盈利组织会计制度核算的基础
  • 劳保统筹费缴费比例
  • 钱汇错了报警有用吗
  • 金融工具减值准则
  • 应收账款平均余额公式
  • 上市公司应付会计
  • 结转销售成本怎么操作
  • windows mysql1045
  • linux系统rm -rf
  • ubuntu20.0安装
  • window10重启按什么键
  • linux怎么安装iso
  • itunes清理iphone垃圾
  • linux lvm2_member
  • win10鼠标移动速度怎么设置
  • opengl纹理贴图正方体六个面
  • matplotlib pypi
  • 微信小程序吸血鬼 豹女
  • jquery 引入js
  • vue-cli lib
  • python同一层次的语言必须对齐吗
  • js遍历foreach
  • python 隐函数作图
  • 西安国家税务局丁雁现任命职务
  • 跨区域提供建筑安装服务
  • 浙江国地税联合电子税务局哪里看收到的发票
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设