当前位置: 首页 > news >正文

nodejs和vue的关系--vue3教程

文章目录

  • 总结性
  • nodejs和vue的关系
  • nodejs和vue产生关系的周边
  • nodejs和vue的区别

总结性

vue是一套用于构建用户界面的前端框架,如果web项目中有前后端分离,前端项目想单独运行在服务器端,那么就要依赖nodeJs。
Vue的配套周边会和Node.js产生关系,Vue和它们一起配合使用的机率比较高,二者在1、Webpack;2、Vue CLI;3、Vuex;4、Vue Router产生交集,提升效率。

Node.js 是一个 JavaScript 运行时,可以在服务器端运行 JavaScript 代码。

Vue.js 是一个前端 JavaScript 框架,主要用于构建用户界面。它可以用于构建单页面应用程序(SPA)或与后端框架(如 Node.js)配合使用来构建服务端渲染的应用程序。

nodejs和vue的关系

如果web项目中没有前后端分离,直接使用的方式引入vue,可以不安装nodeJs。因为这时候当客户端访问网页,网页中使用了vue,然后网页是运行在客户端的浏览器中的,vue.js是js文件,浏览器本来就可以执行js文件,因为浏览器底层有js引擎。
如果web项目中有前后端分离,前端项目想单独运行在服务器端,那么就要依赖nodeJs,不管前端项目是用vue技术栈还是react技术栈,因为项目想要运行,就必须依赖服务器,传统的nodejs可以用express充当服务器;而vue生态圈中有vue-cli脚手架,它已经实现服务器的功能,并且可以在它里面运行vue前端项目。

nodejs和vue产生关系的周边

1、Webpack
Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源。它依赖Node.js这个运行时,使用场景是把开发的源码打包发布,会压缩会分析依赖有效减少出错机率。常见于vue脚手架项目中。
2、Vue CLI
Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,它算是个快速开发工具,通过简单的命令行就可以搭建出一个vue结构的项目,并做了一些默认配置。常和VS Code一起使用,用于管理前端项目。
3、 Vuex
Vuex就是本地的一个store(仓库),可以理解成容器,和其它的容器不同之处是Vuex 的状态存储是响应式的,可以认为它是专门为Vue开发的,主要是解决vue绑定本地储存数据问题。比如我后台登录账号,数据表单等,有了本地容器再做单页应用程序将是一种不同的体验。
4、Vue Router
Vue Router 是 Vue.js 的官方路由。它与 Vue.js 核心深度集成,让用 Vue.js 构建单页应用变得轻而易举。这个也是针对单页应用而出的。注意这个Vue Router是运行在服务端的,也就是和nodeJs发生关系。
5、Vite
0.Vue.js 进行快速开发的工具
1.开发环境速度非常快,体验非常好
2.支持Vue,React等
3.产物简洁清晰。
4.快速的冷启动,不需要打包操作。 5.即时的热模块更新,替换性能和模块数量的解耦让更新飞起; 6.真正的按需编译,不再等待整个应用编译完成

拓展阅读

nodejs和vue的区别

1、服务环境的不同
nodejs一个是前端框架,vuejs一个是服务端语言。nodejs是js运行时,运行环境,类比java中jvm。nodejs的作用和jvm的一样一样的,也是js的运行环境,不管是你是什么操作系统,只要安装对应版本的nodejs,那你就可以用js来开发后台程序。
2、作用的不同
Node.js是一个基于ChromeV8引擎的JavaScript运行环境。
Vue.js使用了基于HTML的模版语法,允许内开发者声明式地将DOM绑定至底层Vue实例的数据。Vue.js的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进DOM的系统。
3、使用数据的不同
Node.js使用了一个事件驱动、非阻塞式I/O的模型,使其轻量又高效。vue.js有路由的叫vue-route.js,vue.js也有数据请求叫vue-resource.js。Vue.js可以在html里引用,使用npm引入是方便容包管理。

http://www.lryc.cn/news/110066.html

相关文章:

  • 前端大屏尺寸实现自适应屏幕大小
  • leetcode 416. 分割等和子集
  • cesium加载三维模型3dtiles
  • el-select控制单选还是多选
  • nginx使用
  • 基于Jenkins+Python+Ubuntu+Docker的接口/UI自动化测试环境部署详细过程
  • Linux|ubuntu下运行python
  • 使用FreeMarker导出word文档(支持导出图片)
  • C/C++中变量按位操作
  • uni、css——制作表格样式的模型
  • mac前端代码编辑 Sublime Text 4 Dev 中文v4.0(4151)
  • 面试之HashMap
  • promethues mysql-rules
  • Maven项目中Lifecycle和Plugins下的install的区别
  • 02-状态模式
  • Python异常处理中异常的种类有哪些?你知道几个?
  • COBOL语言介绍及使用场景
  • 【计算机视觉 | 图像分割】arxiv 计算机视觉关于图像分割的学术速递(8 月 1 日论文合集)
  • Jetson nano 安装swapfile 解决Cannot allocate memory 问题
  • ElasticsSearch基础概念和安装
  • 【GEMM预备工作】行主序和列主序矩阵的内存中的连续性,解决理解问题
  • 利用el-button 画圆 ,通过border-radius >50% 就成圆形
  • 在tensorflow分布式训练过程中突然终止(终止)
  • windows永久暂停更新
  • Android 9系统源码_音频管理(一)按键音效源码解析
  • PyTorch搭建神经网络
  • TiDB 优雅关闭
  • 食品厂能源管理系统助力节能减排,提升可持续发展
  • ABAP读取文本函数效率优化,read_text --->zread_text
  • Spring Data Repository 使用详解