Vue基础阶段入门：使用Visual Studio Code新建项目-基本框架

最新推荐文章于 2024-06-06 16:06:52 发布
最新推荐文章于 2024-06-06 16:06:52 发布
阅读量604 收藏
点赞数 1
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/gin_xin/article/details/126168074
版权

Visual Studio Code：应用程序链接: https://pan.baidu.com/s/138jTEsVN18wm54fa4XT2kA 提取码: tq9j 

vue-2.4.0.js：链接: https://pan.baidu.com/s/10CxnxLiPNK0X9XU0LrwRfw 提取码: tzds 

使用的工具：Visual Studio Code

步骤1： 创建一个Web文件夹（Vue项目），vue-app

步骤2：使用VsCode打开这个vue-app文件夹

步骤3：在Vue-app文件夹下面 创建一个script文件夹，并且拷贝vue-2.4.0.js到script文件夹 下。

（- vue-2.4.0.min.js 压缩版，体积更小，只适合发布的时候使用。- vue-2.4.0.js 开发版，打开源码看到代码格式）

步骤4：在Vue-app文件夹下面，创建一个index.html

步骤5：在index.html文件中导入 vue-2.4.0.js 文件。

<!DOCTYPE html>
<html lang="en">
最低0.47元/天 解锁文章
meetStars
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
vue-2.4.0.js
02-25
vue-2.4.0.js常用的vue前端框架。vue提供大量组件，简单易用，让程序员放手去写代码，减少DOM操作，十分happy！
js的三种引用方法
热门推荐
weixin_46508703的博客
05-07 1万+
1、利用script标签就行引用 <script type="text/javascript"> var str="你好js"; document. write("使用js脚本语言循环输出hellow word!") ; for(var i=0;i<5;i++){ document. write("<h1>你好<h1>"); } </scr...
VS code上创建Vue项目详细化教程2-配置并创建Vue项目
最新发布
Charles_Clark的博客
06-06 871
VS code上创建Vue项目详细化教程2-配置并创建Vue项目
arttemplate模板原始语法
Steamgirl的博客
02-16 469
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equi...
JavaScript(引用方式，基础语法，常用对象）
lmj19929的博客
03-11 858
JavaScript
visual studio code创建vue项目
qq_58983013的博客
07-04 3059
3.选择配置：运行上述命令后，Vue CLI会提示你选择一个配置模板。1.安装Vue CLI：首先，确保你已经在计算机上安装了Node.js。然后，在命令行中运行以下命令来全局安装Vue CLI： npm install -g @vue/cli。2.创建新项目：在命令行中，进入你想要创建项目的目录。然后运行以下命令来创建一个新的Vue项目：vue create my-vue-project。在这个命令中，"my-vue-project"是你想要为项目指定的名称，你可以根据自己的需要进行修改。
VSCode( VisualStudioCode) 写vue项目一键生成.vue模版
01-08
1. 安装一个插件，识别vue文件 2.新建代码片段 文件–>首选项–>用户代码片段–>点击新建代码片段–取名vue.json 确定 3.粘贴入自己写的.vue模板 { Print to console: { prefix: vue, body: [ , , $5 , , ...
vscode新建一个最简单的vue项目
09-27
在本文中，我们将深入探讨如何使用Visual Studio Code（VSCode）创建一个最简单的Vue.js项目。Vue.js是一款轻量级的前端JavaScript框架，以其易学易用和强大的功能深受开发者喜爱。VSCode作为一款功能丰富的代码编辑...
VUE入门1
08-03
安装Vue推荐使用Visual Studio Code（VS Code）作为代码编辑器，然后在终端中执行以下命令全局安装Vue CLI： ```bash npm install -g @vue/cli ``` ️新建Vue工程️ Vue CLI（命令行工具）可以帮助快速创建工程。...
Vue完整入门教程.docx
12-10
* 使用 VisualStudioCode 打开新建的项目 * 了解项目结构和文件的作用 九、结语 本教程旨在帮助初学者快速入门 Vue 框架，了解前端开发技术的基本概念和 Vue 框架的使用方法。学习 Vue 框架需要耐心和实践，希望本...
Microsoft Visual Studio使用NodeJS
04-13
接下来，访问Visual Studio官网（https://visualstudio.microsoft.com）下载并安装Visual Studio，记得在安装过程中选择“Node.js 开发”工作负载，这将包含所有必要的Node.js工具。 ### 二、创建Node.js项目 1. *...
使用js的三种引用方式
m0_71002854的博客
01-04 1065
使用js的三种引用方式。
js的引用类型(详细)
明月清风的博客
10-26 3201
js引用类型Object类型新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 Object类型 你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇
Vue笔记
llj1028的博客
12-26 318
(核心理念：vue：1、数据驱动视图，2、组件化的开发)● 1、企业为了提高开发效率：在企业4E2D，时间就是效率，效率就是金钱； ● 2、企业中，使用框架，能够提高开发的效率； ● 3、提高开发效率的发展历程：原生JS->jQuery之类的类库->前端模板引擎->Angular.js/Vue.js ● 4、能够帮助我们减少不必要的DOM操作；提高渲染效率；双向数据绑定的概念【通过框架提供的指令，我们前端程序员只需要关心数据的业务逻辑，不再关心DOM是如何渲染的了】 ● 5、在Vue中，一个核心的概念，就是
js引用方式
zch2846的博客
08-09 379
js的引用和 css一样，也有多种引入方式 ，分为：行内引入，内部引入，外部引入
JavaScript的三种引用方式
2202_75488514的博客
09-18 3142
JavaScript的三种引用方式：嵌入式、外链式、行内式
Visual Studio Code 创建vue项目
qq_34410726的博客
07-10 3432
vscode 创建vue项目
vue.2.4.0.js_简单易用且高度可定制的Vue.js 2.0模式
cuk5340的博客
07-22 983
vue.2.4.0.js Vue.js模态 (Vue.js modal) Simple to use, highly customizable, mobile friendly Vue.js 2.0+ modal with SSR support. 具有SSR支持的易于使用，高度可定制的，移动友好的Vue.js 2.0+模式。 View demo 查看演示 Download Source ...
visual studio code新建vue
10-11
要在 Visual Studio Code 中新建 Vue 项目，需要先安装 Vue CLI。具体步骤如下： 1. 确保已安装 Node.js，可以在终端中输入 `node -v` 和 `npm -v` 来检查是否已安装。 2. 在终端中输入以下命令来安装 Vue CLI：`...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

meetStars

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值