【星海出品】VUE(一)

Windows安装nvm控制器

Windows里找都PowerShell。右击点击管理员运行。

1.安装choco

 Set-ExecutionPolicy Bypass -Scope Process -Force; iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))

2.安装NVM

 choco install nvm  

3.查看可以安装的版本。

nvm list available
  • 常用命令
    nvm list #查看本地所有node版本
    nvm install 16.13.2 #安装16.13.2 版本
    nvm use 16.13.2 #切换至 16.13.2 版本
    nvm uninstall 16.13.2 #卸载16.13.2 版本

可以在node官网下载

https://nodejs.org/zh-cn

VUE

https://cn.vuejs.org/

npm config set registry https://registry.npm.taobao.org

设置为阿里云的源

npm install -g @vue/cli

安装VUE
vue -V #检查vue是否已经安装

vue create 项目名

创建项目
【星海出品】VUE(一)_第1张图片
创建完成后会有提示。
按照提示继续进行就可以了。

VUE一款渐进式JavaScript框架,所谓渐进式就是逐步实现新特性的意思,如实现模块化开发,路由,状态管理等新特性。其特点是综合了Angular(模块化) 和 React (虚拟 DOM) 的优点;
HTML:页面的结构和内容
CSS:网页的表现央视
JavaScript:控制页面的行为

CSS预处理器

SASS,基于Ruby,通过服务端处理
LESS,基于NodeJS, 通过客户端处理

UI框架

Ant-Design: 阿里巴巴出品,基于React的 UI 框架
ElementUI; 饿了么出品,基于Vue的 UI 框架
Bootsrap: Twitter 推出的一个用于前端开发的开源工具包
AmazeUI: 又叫“ 妹子UI ” 一款 HTMLS 跨屏前端框架

Ant-Desgin圣诞节彩蛋事件

cd vue-demo
root@DevelopmentNode vue-demo $ ls
build  config  index.html  node_modules  package.json  README.md  src  static  test

一。
./index.html

<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>vue-demotitle>
  head>
  <body>
    <div id="app">div>
    
  body>
html>

body中的id=‘app’
会追踪到同级目录下的SRC下的App.vue

root@DevelopmentNode src $ ls
App.vue  assets  components  main.js  router

二。
cat ./App.vue