码农知识堂 - 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 开发框架

  • 相关阅读:
    Modbus协议介绍及Modbus TCP
    开源直播美颜SDK工具算法分析
    Air001 ADC内部输入通道温度传感器读取
    px、rpx、em以及rem的区别与用法
    背包模板(01背包,完全背包)
    Element UI库 之 el-upload 图片上传组件多次上传或重新上传失效bug
    EM@直线的参数方程
    华为OD机试真题 Java 实现【文件目录大小】【2023 B卷 100分】,附详细解题思路
    Spring Cloud【服务网关Gateway(过滤器详解、网关过滤器GatewayFilter、自定义网关过滤器、过滤器之全局过滤器、网关的cors跨域配置)】(七)
    代码随想录 -- day56 -- 583. 两个字符串的删除操作 、72. 编辑距离
  • 原文地址:https://blog.csdn.net/paulwang040/article/details/140448598
  • 最新文章
  • 攻防演习之三天拿下官网站群
    数据安全治理学习——前期安全规划和安全管理体系建设
    企业安全 | 企业内一次钓鱼演练准备过程
    内网渗透测试 | Kerberos协议及其部分攻击手法
    0day的产生 | 不懂代码的"代码审计"
    安装scrcpy-client模块av模块异常,环境问题解决方案
    leetcode hot100【LeetCode 279. 完全平方数】java实现
    OpenWrt下安装Mosquitto
    AnatoMask论文汇总
    【AI日记】24.11.01 LangChain、openai api和github copilot
  • 热门文章
  • 十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧!!!
    奉劝各位学弟学妹们,该打造你的技术影响力了!
    五年了,我在 CSDN 的两个一百万。
    Java俄罗斯方块,老程序员花了一个周末,连接中学年代!
    面试官都震惊,你这网络基础可以啊!
    你真的会用百度吗?我不信 — 那些不为人知的搜索引擎语法
    心情不好的时候,用 Python 画棵樱花树送给自己吧
    通宵一晚做出来的一款类似CS的第一人称射击游戏Demo!原来做游戏也不是很难,连憨憨学妹都学会了!
    13 万字 C 语言从入门到精通保姆级教程2021 年版
    10行代码集2000张美女图,Python爬虫120例,再上征途
Copyright © 2022 侵权请联系2656653265@qq.com    京ICP备2022015340号-1
正则表达式工具 cron表达式工具 密码生成工具

京公网安备 11010502049817号