Vue 前瞻 (Vue与脚手架,安装教程)

目录

一、Vue的开发方式分两种:

二、脚手架环境:

三、生成项目包:

四、项目包的使用方式

每日一句


一、Vue的开发方式分两种:

  1. 脚本模式: 类似jQuery, 通过引入脚本来完成开发 -- 适合入门阶段
    1. 下载地址: 安装 — Vue.js

  2.  脚手架模式: 生产场景中使用, 专业的 工程化 开发模式     

二、脚手架环境:

  1. 环境要求: node版本: 12~16

    1. 检查命令: node -v
    2. 安装包下载地址: 下载 | Node.js 中文网

  2. npm: 包管理工具要求中国镜像
    1. 查看当前镜像: npm get registry
    2. 设置镜像的命令: npm set registry https://registry.npm.taobao.org/
    3. 全局安装 vue的脚手架工具

      1. npm i -g @vue/cli
      2. 安装后使用 vue -Vvue --version 来查看版本  
      3. 问题

三、生成项目包:

  1. 安装脚手架软件后, 目的是为了生成项目包
  2. 注意事项:
    1. 要生成项目包的目录下, 不允许存在 vue.js 文件

    2. 项目包所在目录中, 不允许存在中文和特殊字符

  3. 执行安装命令: vue create 包名
    1. 在你希望创建项目包的目录下, 执行
    2. 包名不允许大写字母, 用-间隔多个单词 , 例如 vue-pro
    3. 后续的所有选项, 直接按回车, 自动采用默认项即可
  4. 成功生成

四、项目包的使用方式

  1. 脚手架生成的项目包十分完善
  2. 自带服务器
    1. 在项目包vue-pro目录下, 打开cmd命令行工具, 运行启动服务器命令 npm run serve
      1.  

  3. 访问服务器: 在浏览器地址栏输入 命令行中的网址, 能查看即可
  4.  常见错误: 把 serve 写成 server

每日一句

不怨天,不尤人。

"遇到挫折与失败,绝不从客观上去找借口,绝不把责任推向别人,后来发展为成语“怨天尤人”。 "

        

  • 4
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

张的俊.

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值