• Win10安装Vue


    1.下载并安装Node.js
    下载地址:https://nodejs.org/en/download/
    下载node-v12.16.1-x64.msi
    
    2.在cmd中查看node.js是否安装成功,以及是否安装npm
    node -v
    npm -v
    
    3.安装vue的脚手架工具(vue项目前期项目目录结构的工具)
    npm config set registry https://registry.npm.taobao.org
    npm config get registry
    npm install -g @vue/cli
    npm install -g @vue/cli-init
    npm install -g webpack@3.12.0
    npm install webpack@3.12.0 -D
    npm install -g webpack-dev-server@2.11.2
    npm install webpack-dev-server@2.11.2 -D
    
    
    通过vue --version验证
    
    查看安装目录 C:Usersliw66AppDataRoaming
    pm
    
    4.在cmd中使用webpack创建一个vue项目
    #进入到项目目录
    cd D:projectvue
    #创建项目
    vue init webpack 项目名称
    
    之后会出现对话提示。单元测试和e2e测试选n,其他选择回车,安装完成
    
    5.运行第一个Vue网站
    在cmd中输入以下命令
    cd 项目名称
    npm run dev
    打开http//:localhost:8080就可以访问
    在config/index.js里面修改端口号
    
    6.如何使用编辑工具打开网站
    下载 Visual Studio Code 
    在vsCode中打开项目文件路径
    
    7.vscode设置自动保存,Settings搜索
    files.autoSave将off改为onFocusChange
    失去焦点自动保存
    
    8.安装element-ui
    npm i element-ui -S
    
    在src/main.js中加入
    import ElementUI from 'element-ui'
    import 'element-ui/lib/theme-chalk/index.css'
    Vue.use(ElementUI)
    
    在vue文件里加入
    <el-button type="primary">主要按钮</el-button>
    
    9.Vue语法
    文本
    数据绑定使用 {{...}}
    Html
    使用 v-html 指令输出 html 代码
    属性
    HTML 属性使用 v-bind 指令
    指令
    指令是带有 v- 前缀的特殊属性。
    v-if v-else v-else-if 条件判断
    v-for 循环
    v-on 事件监听
    v-model 双向数据绑定
  • 相关阅读:
    整理sql server数据类型
    【MVC4升级到MVC5】ASP.Net MVC 4项目升级MVC 5的方法
    MVC学习笔记:入门
    maven第一次创建项目太慢解决方法
    idea中创建maven的Javaweb工程并进行配置
    idea中MavenWeb项目不能创建Servlet的解决办法
    Java模拟客户端向服务器上传文件
    Java学习随笔---常用API(二)
    ssh设置超时时间
    linux 登陆失败处理
  • 原文地址:https://www.cnblogs.com/liw66/p/12573913.html
Copyright © 2020-2023  润新知