码农知识堂 - 1000bd
  •   Python
  •   PHP
  •   JS/TS
  •   JAVA
  •   C/C++
  •   C#
  •   GO
  •   Kotlin
  •   Swift
  • nodejs安装部署运行vue前端项目


    文章目录

    • 1.安装nodejs
    • 2.安装Vue CLI
      • 1.配置npm镜像源:
      • 2.安装Vue CLI:
      • 3.创建Vue项目
      • 4.启动Vue项目
      • 5.Express

    1.安装nodejs

    Node.js® 是一个免费、开源、跨平台的 JavaScript 运行时环境,它让开发人员能够创建服务器、Web 应用、命令行工具和脚本。

    • 访问Node.js官网。
    • 输入node -v和npm -v命令,查看Node.js和npm的版本号,以确认安装成功。

    npm(Node Package Manager)是Node.js的官方包管理工具,它具有多重作用,为JavaScript开发者提供了高效、灵活和可靠的包管理解决方案。

    2.安装Vue CLI

    vuecli脚手架是干什么的?
    ‌Vue CLI是一个官方提供的命令行工具,用于快速创建和管理Vue.js项目。
    它的主要功能和特点包括:‌

    • 快速项目生成:Vue CLI可以快速生成一个基本的Vue项目结构,包括必要的文件和配置,使得开发者可以立即开始编码,无需手动设置基础结构。‌12
    • 基于‌Webpack:Vue CLI基于Webpack构建,这意味着它利用Webpack的强大功能进行资源管理和代码优化,如依赖管理、代码分割和性能优化等。‌13
    • 开箱即用和易于扩展:Vue CLI提供了合理的默认配置,使得新项目可以立即运行,同时它也支持通过插件和配置文件进行扩展,以满足特定需求。‌12
    • 命令行和图形界面:除了命令行界面外,Vue CLI还提供了一个图形化用户界面,使得项目管理更加直观和方便。
    • 支持‌Vue 2和‌Vue 3:Vue CLI支持创建基于Vue 2和Vue 3的项目,适应不同的开发需求。‌

    总之,Vue CLI是一个强大的工具,帮助开发者更高效地构建和维护Vue.js应用。

    1.配置npm镜像源:

    #临时配置
    npm config set registry https://registry.npmmirror.com
    # 永久配置
    npm config set registry https://registry.npmmirror.com
    

    2.安装Vue CLI:

    npm install -g @vue/cli
    vue -V
    

    3.创建Vue项目

    创建项目:
    在命令行中,使用cd命令切换到你想创建Vue项目的目录。
    输入vue create 项目名命令(将“项目名”替换为你想要的项目名称),并按提示操作。Vue CLI会引导你完成项目的创建过程,包括选择预设、配置Vue Router、Vuex等。
    进入项目目录:
    项目创建完成后,使用cd 项目名命令进入项目目录。

    vue create myvue
    # 项目名不能大写
    

    在这里插入图片描述

    cd myvue
    npm run serve
    npm run build
    # 项目生成dist文件夹下
    

    4.启动Vue项目

    npm install
    npm run dev
    

    5.Express

    基于 Node.js 平台,快速、开放、极简的 Web 开发框架

  • 相关阅读:
    抖音短视频带货的红利马上结束了
    迅为3A5000_7A2000开发板龙芯全国产处理器LoongArch架构核心方案
    SCDM 实例教程:基本几何建模
    【Benewake(北醒) 】中距 TF02-Pro-W TTL/485介绍以及资料整理
    redis初级介绍
    VUE基础知识五:组件的分类、组件间传值、事件调用等
    【C++】内存管理到用new申请堆内存
    iOS开发者是钻研SwiftUI还是尝试接触Flutter好呢?
    spring之bean的生命周期
    vue2+echarts:后台传递一天有多类数据的时候,如何渲染柱状图
  • 原文地址:https://blog.csdn.net/paulwang040/article/details/140448598
  • 最新文章
  • 沪漂五周年了:我越来越迷茫了
    Agentic Skill Routing 实战:别再把所有 Skill 塞进 AI Agent 上下文
    MySQL-Seconds_behind_master的精度误差
    [MAF预定义ChatClient中间件-03]CachingChatClient——利用缓存省钱省时间
    AI的至暗历史:从万众期待到被政府撤资,AI的两次死亡徘徊
    Agent OS :五种驯服不确定性的范式
    PortSwigger SQL注入LAB11
    数据库即时编译JIT
    [Begin]AI Learn Data Day 0
    深度学习进阶(二十七)现代 LLM 的核心架构设计其二:SwiGLU
  • 热门文章
  • 十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧!!!
    奉劝各位学弟学妹们,该打造你的技术影响力了!
    五年了,我在 CSDN 的两个一百万。
    Java俄罗斯方块,老程序员花了一个周末,连接中学年代!
    面试官都震惊,你这网络基础可以啊!
    你真的会用百度吗?我不信 — 那些不为人知的搜索引擎语法
    心情不好的时候,用 Python 画棵樱花树送给自己吧
    通宵一晚做出来的一款类似CS的第一人称射击游戏Demo!原来做游戏也不是很难,连憨憨学妹都学会了!
    13 万字 C 语言从入门到精通保姆级教程2021 年版
    10行代码集2000张美女图,Python爬虫120例,再上征途
小工具 小游戏
Copyright © 2022 侵权请联系2656653265@qq.com    京ICP备2022015340号-1

京公网安备 11010502049817号