Vue学习(一)

1.nodejs安装

nodejs.cn //安装网址根据机型选择对应的版本安装

下载好后一直下一步就可以了,记下安装路径用于环境变量配置一般放到C://

在phth的环境变量中添加安装好的nodejs目录路径方便在系统的任何地方都能使用nodejs

cmd验证nodejs与npm的版本node -v 与 npm -v

2.常用的dos命令

  • cd 打开文件夹

  • md创建新文件夹

  • dir查看文件夹内容

  • cd…返回上一级文件夹

3.npm安装及参数配置

  • npm与cnpm的区别:

      cnpm 国内淘宝镜像的npm管理器用于替代国外服务器
    
      npm(node package manager) 是 nodejs包管理器
    
  • -g 全局安装(global)

      全局安装(global),可以在命令行下直接使用
      可以通过npm root -g查看全局安装的文件夹位置
    
  • 安装命令 :

      npm install -g vul-cli
    
      cnpm install -g vue-cli
    
  • 手动指定从哪个镜像服务器获取资源

      npm install -gd express --registry=http://registry.npm.taobao.org(使用频率不高,只有在安装脚手架的时候才会使用)
      
      为了避免每次安装都需要--registry参数,可以使用如下命令进行永久设置
      
      npm config set registry http://registry.npm.taobao.org    
    
  • -S参数 --save 安装包信息加入到dependencies(生产阶段的依赖)

      例如:npm i -g --save --dev vue-cli
      (ctrl+c 终止命令)
    
  • -D参数 --save–dev安装包信息将加入到devdependencies(开发阶段依赖)

      npm i -D vue-cli 本地安装(没有-g) 会报错需要:
    
      npm init -f 初始化本地安装配置文件
    
      建议全局安装
      
      或者 npm i -gD vue-cli (-D参数大小写都可以)
    
  • i参数是install的缩写


4.cnpm安装(下载)–主要使用这种方式

cnpm的镜像使用配置指令

npm install -g cnpm --registry=https://registry.npm.taobao.org 

验证cnpm是否安装成功 cnpm -v

出现版本号就代表成功了

安装好后通过 cnpm install -gd vue-cli 安装vue-cli2脚手架

检查vue版本命令 vue -V

5.创建vue-cli项目

  • 命令行创建:vue init webpack (projectName)(如果创建项目失败了,则在当前文件夹中重新安装vue-cli cnpm install -gd vue-cli )

      init:创建
          
      webpack:模板(一般都是用webpack非常的常用)
    
      (projectName):项目名称,注意一定要小写
    
  • 创建cli过程中部分配置内容

     nstall vue-router?(Y/N)是否安装vue-router,这是官方的路由,大多数要使用
     
     Use ESLint to lint your code? (Y/N) 是否使用ESLint管理代码,ESLint是个代码风格管理工具,是用来统一代码风格的,一般项目都会使用。
     
     npm run dev 启动项目
    

6.vue语法学习&说明

【注意】

1、地址栏中的#,是为了防止http频繁请求后台造成压力

2、hash模式:地址栏包含#符号,#以后的内容不会被后台获取

3、history模式:具有对url历史记录进行修改的功能

4、在微信支付、分享url作为参数传递时,#属于特殊符号,不能满足需求

5、history需要后台配合,来处理404的问题

修改为history模式   mode:'history'

6.1单独安装eslint:

安装到生产环境:npm install eslint --save

安装到开发环境:npm install eslint --save-dev

生产环境:package.json中的dependencies

开发环境:package.json中的devDependencies

卸载:npm uninstall eslint --save / npm uninstall eslint --dev    

6.2如何导入vue-cli项目

cd进入到项目中然后npm install安装vue项目依赖

进入后可以先检查是否有vue-cli项目的运行环境,验证npm与vue是否安装即可:

npm -v 和vue -V(注意vue -V V 是大写的)

如果都出现版本号就不需要安装npm依赖直接可以npm run dev

都实现以后就可以直接将项目跑起来
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值