Node服务器 & Vue & 路由配置

这篇具有很好参考价值的文章主要介绍了Node服务器 & Vue & 路由配置。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

一、安装node服务器

        1、官网下载路径

                       Node.js

                Node服务器 & Vue & 路由配置,vue.js,前端,javascript

二、安装Node服务器

        1、下载后进行安装

                        下载的以 .msi 结尾的文件 双击打开一直 next (下一步)

            2、   安装完之后

                                在Windows窗口输入这两行命令,查看版本是否安装成功

Node服务器 & Vue & 路由配置,vue.js,前端,javascript

                3、不建议使用cnpm

三、使用vue

                        -g 是全局配置

        1、黑窗口运行以下命令

                ① npm i  vue-cli -g

                       

Node服务器 & Vue & 路由配置,vue.js,前端,javascript

        2、Webpack

                ② npm i webpack -g

                ③ npm i webpack-cli -g

Node服务器 & Vue & 路由配置,vue.js,前端,javascript

四、创建项目

        1、创建项目文件夹

                首先创建一个存放项目的文件夹

        2、跳转至当前项目文件夹

                Node服务器 & Vue & 路由配置,vue.js,前端,javascript

        3、创建项目

                创建命令:  vue create 项目名Node服务器 & Vue & 路由配置,vue.js,前端,javascript

        4、升级之后

                再次执行上行命令,进行创建

Node服务器 & Vue & 路由配置,vue.js,前端,javascript

Node服务器 & Vue & 路由配置,vue.js,前端,javascript

        5、运行

                Node服务器 & Vue & 路由配置,vue.js,前端,javascript

                6、运行成功结果

                           Node服务器 & Vue & 路由配置,vue.js,前端,javascript

五、路由

        1、定义路由

                定义路由的时候  path的路径一定是唯一的

                如果写name   对应的值 也得是唯一

                         Node服务器 & Vue & 路由配置,vue.js,前端,javascript

        2、<router-view/> 标签

                容器 作用  存放组件   一般寻访到父组件里面

                App.vue是所有组件的父类

                在vue 里面 @ 代表的是src

                Node服务器 & Vue & 路由配置,vue.js,前端,javascript

        3、<template>  标签

                        一个 <template> 只能有一个根标签

                        如果出现两个根标签,会报图中的错误Node服务器 & Vue & 路由配置,vue.js,前端,javascript

         4、写个组件

<template>
	<div>
		这是一个vue组件
	</div>
</template>

<script>
	
</script>

<style>
	
</style>

        5、在router/index.js中配置路径

                Node服务器 & Vue & 路由配置,vue.js,前端,javascript

        6、访问

        Node服务器 & Vue & 路由配置,vue.js,前端,javascript

六、启动命令

        Npm run XXX

Node服务器 & Vue & 路由配置,vue.js,前端,javascript文章来源地址https://www.toymoban.com/news/detail-791913.html

到了这里,关于Node服务器 & Vue & 路由配置的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【小沐学前端】Node.js搭建HTTPS 服务器

    HTTPS是什么?HTTPS是基于TLS/SSL的HTTP协议。 HTTPS (全称:Hypertext Transfer Protocol Secure),是以安全为目标的 HTTP 通道,在HTTP的基础上通过传输加密和身份认证保证了传输过程的安全性。HTTPS 在HTTP 的基础下加入SSL,HTTPS 的安全基础是 SSL,因此加密的详细内容就需要 SSL。 HTTPS 存

    2024年02月03日
    浏览(33)
  • 记:vite3+vue3+axios前端项目跨域问题解决【前端和服务器nginx配置】

    前言:什么是跨域,网上一搜一大把,所以这里直接跳过,直入主题。 处理方式:不通过后端处理跨域,通过前端+服务器nginx处理。 1.前端涉及处理跨域的必要配置(开发环境、生产环境):vite3、vue3、axios 2.服务器涉及处理跨域的配置(生产环境):nginx【主要用到其配置

    2024年02月01日
    浏览(41)
  • 超简单的node.js服务器配置(1)

    node安装教程我之前有出过,不会的可以去看一下(node.js安装教程) 1.引入http模块(这个模块是node.js内置的模块) 2.创建服务器实例并监听端口(8080)开启服务器,监听客户端请求并进行处理 打开服务器地址 127.0.0.1:8080/ 查看一下效果: http.createServer()方法有一个参数为回调函数

    2024年02月15日
    浏览(35)
  • 云服务器部署vue/node项目

    此处以阿里云服务器为例,配置的是LNMP环境 以阿里云服务为例,端口自定义99 1、在 /usr/share/nginx/html/ 该目录下新建文件夹,该文件夹是部署的打好包的前端项目 例: 2、进入nginx目录配置相关配置文件:/etc/nginx/conf.d/,在新建lemons.conf文件 touch /etc/nginx/conf.d/lemons.conf  //快速

    2024年02月04日
    浏览(40)
  • Vue的路由使用,Node.js下载安装及环境配置教程 (超级详细)

    前言: 今天我们来讲解关于Vue的路由使用,Node.js下载安装及环境配置教程 首先我们Vue的路由使用,必须要导入官方的依赖的。 BootCDN - Bootstrap 中文网开源项目免费 CDN 加速服务 https://www.bootcdn.cn/ 路由思路 1、引入路由的js依赖 2、定义组件内容用来显示网页中的内容 3、定义

    2024年02月07日
    浏览(49)
  • 【node.js从入门到精通】使用express创建web服务器,路由,进行中间件的创建链接路由及其他中间件

    目录 前言 初识express 使用express创建基本的web服务器 初识express路由 路由匹配概念 路由模块化 中间件 中间件和路由的区别 定义中间件函数 中间件作用   局部生效中间价 中间件分类  1.应用级别中间件  2.路由级别的中间件  3.错误级别中间件  4.内置中间件  5.自定义中间

    2024年02月02日
    浏览(42)
  • Node.js安装与配置指南:轻松启航您的JavaScript服务器之旅

    Node.js作为一个基于Chrome V8引擎的JavaScript运行时环境,已经成为现代web开发中不可或缺的重要工具之一。它的出现极大地扩展了JavaScript的应用范围,使得开发者可以利用同一种语言来编写前端和后端的代码,从而实现全栈开发。Node.js具有非阻塞I/O、事件驱动的特性,使得它能

    2024年04月10日
    浏览(40)
  • 在Linux中安装和配置Node.js与Express.js创建HTTP服务器

    在Linux环境中,安装和配置Node.js与Express.js来创建一个HTTP服务器需要一系列的步骤。下面是一个详细的指南,帮助你在Linux上设置这个环境。 步骤1:安装Node.js 首先,你需要确保你的Linux系统已经安装了Node.js。你可以通过以下命令来检查是否已经安装: bash 复制代码 node -v 如

    2024年01月16日
    浏览(60)
  • Nginx-http-flv-module流媒体服务器搭建+模拟推流+flv.js在前端html和Vue中播放HTTP-FLV视频流

    Windows上搭建Nginx RTMP服务器并使用FFmpeg实现本地视频推流: Windows上搭建Nginx RTMP服务器并使用FFmpeg实现本地视频推流_win nginx-rtmp最新版_霸道流氓气质的博客-CSDN博客 Vue中使用vue-video-player和videojs-flash插件实现播放rtmp视频文件流: Vue中使用vue-video-player和videojs-flash插件实现播放

    2024年02月03日
    浏览(35)
  • 前端Vue Node.js + Express + MongoDB 构建的后端服务API接口

    构建一个使用 Vue.js 作为前端, Node.js + Express + MongoDB 作为后端服务的全栈应用涉及到多个步骤。这里简要概述整个过程,并提供一些基本的代码示例来帮助你开始。 安装 MongoDB: 根据你的操作系统从 MongoDB 官网 下载并安装 MongoDB。 启动 MongoDB 服务: 安装完成后,根据 MongoDB 的

    2024年04月14日
    浏览(34)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包