网站建设的工具是,汽车营销型网站建设,集团网站建设详细策划,创建全国文明城市应知应会知识前言
本章内容为VUE前端环境搭建与相关前端技术讨论。
下一篇文章地址#xff1a;
Vue 3#xff1a;玩一下web前端技术#xff08;二#xff09;_Lion King的博客-CSDN博客
一、环境搭建
1. 安装Node.js
Vue是基于Node.js的#xff0c;因此首先需要安装Node.js。官网…前言
本章内容为VUE前端环境搭建与相关前端技术讨论。
下一篇文章地址
Vue 3玩一下web前端技术二_Lion King的博客-CSDN博客
一、环境搭建
1. 安装Node.js
Vue是基于Node.js的因此首先需要安装Node.js。官网地址Node.js
2. 安装Vue CLI
Vue CLI是一个用于快速构建Vue项目的脚手架工具可以输入以下命令来全局安装Vue CLI
npm install -g vue/cli
3. 创建Vue项目
在命令行工具中使用以下命令创建一个新的Vue 3项目
vue create my-project
4. 配置Vue项目
创建项目后Vue CLI将会询问您关于一些配置选项直接按下回车键使用默认配置。
5. 启动开发服务器
项目创建完成后进入项目文件夹 cd my-project 然后使用以下命令启动开发服务器 npm run serve
6. 访问开发服务器
根据提示在浏览器中输入网址即可 7.开发环境
采用VScode进行开发。官网地址https://code.visualstudio.com/ 二、前端相关技术讨论
1、一定要用vue-cli么
可以不安装只是要配置工程比较麻烦。如果使用这种集成工具有好有坏。好的是可以了解配置项增加技术底蕴坏的是效率不高用起来不爽。而本系列文章将是爽文要爽起来就各种工具直接使用必要的时候再去研究也不迟。
实际上Vue 3已不再推荐使用脚手架一是服务的启动速度慢从而导致调试效率不高项目越大越明显二是有更好的替代品详见Vue相关文档介绍 — Vue.js。
2、npm与cnpm
npm是Node.js官方提供的软件包管理工具用于安装、更新和卸载Node.js模块。
cnpm是由淘宝团队开发的一个npm的镜像工具旨在解决npm在国内下载速度慢的问题。
使用cnpm和npm的方式基本相同都可以通过命令行工具进行安装、更新和卸载模块。
如果你在国内使用npm下载速度缓慢可以考虑使用cnpm来代替npm。但是在一些特殊情况下可能还是需要使用npm比如cnpm运行不了的服务npm能运行。
3、为什么选择Vue
其实都行一个真正的前端开发不只要会Vue还要会一些主流的前端框架而我只是想玩玩并且相信不同编程语言的编程是想通的因此才会有系列文章。
4、为什么选择VScode
其实都行开源免费使用的人很多生态不错有搞头开发环境选择一种顺手的就好无需纠结。
5、前端技术都要会哪些
这可就多了在日益更新的技术里简直就是学不过来。html、css、js这些基础总是要会一点的反正逃不掉我一般不记这些用到的时候查一下文档就好即使记了很快也会忘掉因为就不是那种专业的前端技术人员。
6、我们该如何学习VUE
VUE官方建议先掌握前端的基本技术再学习因此可以按照以下步骤进行
1熟悉HTML、CSS和JavaScriptVue.js是一个基于JavaScript的框架要学习Vue.js首先需要对这些基础的前端技术有一定的了解。
2了解Vue.js的核心概念Vue.js有一些核心的概念包括组件、模板、生命周期等。弄清楚这些概念对于理解和使用Vue.js非常重要。
3安装Vue.js你可以通过下载Vue.js的源码或者直接使用CDN等方式来引入Vue.js。另外你也可以使用Vue CLI来快速搭建Vue.js项目。
4创建一个Vue实例Vue.js的核心是Vue实例可以通过创建一个Vue实例来构建你的应用程序。在创建实例时你需要指定一些选项例如挂载点、数据等。
5学习Vue的指令和模板语法Vue.js提供了一些指令用于操作DOM和绑定数据在学习Vue.js时掌握这些指令并了解模板语法非常重要。
6理解Vue的组件化开发Vue.js是一个面向组件的框架通过组件化的开发方式可以使代码更加模块化和可重用。学习如何创建和使用组件是掌握Vue.js的重要一步。
7掌握Vue的生命周期Vue.js的每个组件都有一个生命周期这些生命周期钩子函数可以在组件不同的阶段执行一些操作。理解和使用生命周期函数对于处理组件的行为和数据非常有用。
8学习Vue的状态管理当应用程序变得复杂时管理组件之间的状态可能变得困难。Vue.js提供了Vuex作为状态管理工具学习如何使用Vuex可以更好地管理和共享状态。
9练习和项目实践通过练习和实际项目实践你可以加深对Vue.js的理解和应用。尝试使用Vue.js构建一些小项目以巩固你所学的知识。
不过本系列文章将不会直接涉及HTML、CSS和JavaScript但会间接涉及用到的时候我们再说。