Vue踩坑第一步，安装Vue最新版本

学习vue第一步肯定是安装vue-cli,那么肯定想去搜下如何安装vue-cli呢? 网上搜到的结果大都是: npm i vue-cli -g 输入vue -V发现: 输入node -v发现: 自己明明按照官网(Vue CLI 需要 Node.js 8.9 或更高版本)安装了高于8.9的版本,但为何vue版本还不是最新的3.x版本原因是你刚开始安装时就输入了安装2.x版本的指令,新版本的指令是 @vue/cli 而非 vue-cli 正解:安装最新版的: 卸载2.x版本的vue-cli : n…

vue.js 踩坑第一步利用vue-cli vue-router搭建一个带有底部导航栏移动前端项目

vue.js学习踩坑第一步 1.首先安装vue-cli脚手架不多赘述,主要参考WiseWrong 的 Vue 爬坑之路(一)-- 使用 vue-cli 搭建项目 2.项目呈现效果项目呈现网址:www.zhoupeng520.cn/index.html 3.项目主要目录 4主要代码如下 (1)App.vue <template> <div id="app"> <router-view class="view">&l…

vue踩坑记

vue踩坑记易错点语法好难啊qwq 不要把'data'写成'date' 在v-html/v-bind中使用vue变量时不需要加变量名在非vue事件中使用vue中变量时需要加变量名正确 <div id="vue"> <button onclick="vm.ColorRed=vm.ColorRed^1">gg</button> <div v-html="site" v-bind:class="…

vue踩坑之旅 -- computed watch

vue踩坑之旅 -- computed watch 经常在使用vue初始化组件时,会报一些莫名其妙的错误,或者,数据明明有数据,确还是拿不到,这是多么痛苦而又令人忍不住抓耳挠腮,捶胸顿足啊技术点 vue + element + ehcarts + vuex + vue-router 问题再现 data() { return { option: { chart: '' //echarts的实例 } } }, //钩子函数 mounted() { this.chart = echarts.init…

Vue入坑第一篇

写在前面的话:文章是个人学习过程中的总结,为方便以后回头在学习.文章中会参考官方文档和其他的一些文章,示例均为亲自编写和实践,若有写的不对的地方欢迎大家和我一起交流. 一.前言本篇作为vue入门的一篇总结,目地在使用vue一些简单的特性去打开vue的学习之门. 二.搭建vue开发环境搭建vue的开发环境一般有两种方式,一种是使用vue-cli脚手架,这个需要具备Node的一些基础知识:第二种方式是在我们编写的html页面中引入vue.js文件,就可以使用vue了.后续vue基础的学习会用使用…

Mac系统下使用VirtualBox虚拟机安装win7－－第一步安装vbox虚拟机

Mac系统下使用VirtualBox虚拟机安装win7操作步骤: 第一步安装vbox虚拟机 1.先下载vbox,下载地址:: https://www.virtualbox.org/wiki/Downloads ,在页面中点击“VirtualBox 5.0.16 for OS X hosts amd64”下载链接,如图所示:…

Git安装教程最新版本（国内gitee国外github）

Git安装教程最新版本(国内gitee国外github) 欢迎关注博主公众号「Java大师」, 专注于分享Java领域干货文章, 关注回复「资源」, 获取大师使用的typora主题: http://www.javaman.cn/git/git-install 1.git下载 git官网的下载地址:Git (git-scm.com),如下图所示: 用的才做系统,显示直接下载windows版本,这点事比较只能的(如果识别错误,可以在中间选择系统),点击即可下载.目前版本为:Git-2.31.1-64…

CentOS7 yum 安装 Nginx最新版本

CentOS7 yum 安装 Nginx最新版本下载对应当前系统版本的nginx包(package) # wget http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ngx.noarch.rpm 建立nginx的yum仓库 # rpm -ivh nginx-release-centos-7-0.el7.ngx.noarch.rpm 下载并安装nginx # yum install nginx…

『vue踩坑日常』在index.html中引入静态文件不生效

Vue日常踩坑日常 -- 在index.html中引入静态文件不生效问题本文针对的是Vue小白,不喜勿喷,谢谢出现该问题的标志如下控制台warning(Resource interpreted as Stylesheet but transferred with MIME type text/html) 出现的原因及解决办法第一种可能出现原因就是引入的静态文件在src文件夹内,这种的解决办法就是把资源引入静态资源的目录static 第二种可能出现的原因就是有单独的静态资源目录但是名字不叫…

vue踩坑(二):跨域以及携带cookie

最近后台需求要在请求的时候传cooki给后台,正常情况下拿到cookie后存在cookie里,同域名下是会自己带到请求头里的,但是因为要在本地调试,那么问题就来了,localhost:8080下面的cookie是不会带到线上的请求头里的,于是问题产生了,好了废话不多说,看看我踩坑的过程吧,希望对大家有所帮助. 首先我在main.js里面加了这么一段代码这段代码我网上搜了下说是叫拦截器,意思就是你可以在所有的接口请求之前可以先执行你的方法,比如说:我后返回401是没有登录,那么我就可以在ne…

vue 踩坑记录

1.绑定双击事件用 @dblclick 不要用@ondblclick 在vue中@=on 2.Vue中路由跳转踩坑. 比如我的路由如下定义 routes: [ { path: "/", name: "index", component: Index }, { path: "/gallery", name: "gallery", component: Gallery, children: [ { path: "top…

vue踩坑之路--点击按钮改变div样式

有时候,我们在做项目的时候,想通过某个按钮来改变某个div样式,那么可以通过以下代码实现: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Page Title</title> <…

Vue踩坑系列

前言前端开发对于vue的使用已经越来越多,它的优点就不做介绍了, 本篇是我对vue使用过程中遇到的问题中做的一些总结,帮助大家踩坑.如果喜欢的话可以点波赞,或者关注一下,希望本文可以帮到大家!!! 本篇介绍的问题大概如下: 路由变化页面数据不刷新问题 setTimeout/setInterval(泛指异步回掉函数的this指向)this指向改变,无法用this访问VUe实例 setInterval路由跳转继续运行并没有及时进行销毁 vue 滚动行为用法,进入路由需要滚动到浏览器底部头部等等…

vue踩坑记，持续更新中......

1.运行项目报错 you may use special comments to disable some waring. use //eslint-disable-next-line.....吧啦吧啦解决办法: 找到webpack.base.conf.js,注释掉下面一段 const createLintingRule = () => ({ // test: /\.(js|vue)$/, // loader: 'eslint-loader', // enforce: 'pre', // in…

vue踩坑记录:[Vue warn]: $attrs is readonly.

今天在用element-ui的DatePicker日期选择器的时候,发现每当点击一次这个组件,控制台就会报警告`[Vue warn]: $attrs is readonly`,但是也不影响实际操作效果.网上搜了一圈后,发现是使用的vue与vue-tempalte-compiler的版本不一致造成的.当时使用的vue是最新版本2.6.10,而vue-template-compiler版本是2.5.21. **解决方法:** 降低vue的版本至2.5.21. `npm uninstall vue`…

VUE踩坑之路

一.常见报错 1.vue-cli-service 不是内部或外部命令,也不是可运行程序解决方案: 用以下命令安装Vue CLI就好 npm install -g @vue/cli # OR yarn global add @vue/cli 官方链接:https://cli.vuejs.org/zh/guide/installation.html 2.Visual Studio Code 创建的VUE项目用IDEA打开报Expected indentation of() spaces but f…

Vue踩坑1——驼峰命名

使用自定义Vue组件的时候,其他个方面都正常,但是浏览器就是显示不出自定义标签里的内容 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="app"> <Cra2iTeT&…

Openstack（企业私有云）万里长征第一步——安装

一.前言单位新进了十几台服务器,建了一个高标准的一体化机房,状似刘姥姥进大观园的我,从机房规划到企业私有云搭建一一重头学来,除了机房泥墙其他基本都涉猎到了. 从企业私有云这个名字就能看出这是多么复杂的一个东西.牵涉到服务器.交换机.防火墙.网络规划.云系统搭建.个个都是厉害的角,用张国荣的话说:"咱什么时候也都成角?".成角不成角不说,经过十几天的折腾,今天才把Openstack安装成功,期间经历了酷似炼狱的种种阶段.现简单记录整个安装过程以及踩过的坑,供自己查阅或后来人参考. 二.…

记录自己的踩坑第一天 | CSS:vertical-align 属性

前言最近老师让大家单独写前后端分离项目,真是大家卷完后端,一起去卷前端了.(我以前都是主要负责后端,处于只大致看的懂的级别,说多了都是泪啊). 真是处于一边学一边写的状态,基本就是每天早上看上两~三小时视频(主要是复习css.js.vue框架),之后开始敲代码. 只有等到晚上回到寝室才有空写写文章,复习和总结一遍. CSS:vertical-align 属性 vertical-align 属性设置元素的垂直对齐方式. 我们直接用案例来说明: 1)代码: html代码: <div class=&qu…

【vue.js】windows下安装vue.js

windows下搭建vue开发环境 Vue.js是一套构建用户界面的 “渐进式框架”.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合.2016年,Vue同Angular.React形成三足鼎立的局面,让前端的开发者顾不暇接,今天我们就来了解一下Vue的环境搭建. 一.node.js安装Vue项目通常通过webpack工具来构建,而webpack命令的执行是依赖node.js的环境的,所以首先要安装nod…

Git 系列——第一步安装 Git

之前也没有用过什么版本控制的工具,唯一用过的就是 SVN 了,不过也只是简单的使用而已,比如写好代码就签入,没了?是的,没了. 于是接触到了 Git 这个分布式版本控制软件,接下来就让我们好好学习,天天向上吧. 第一步当然需要安装 Git 了,其实这一步本来没什么可说的,毕竟程序员哪有不会装软件的...说的也是.不过还是打算一步一步来. 由于我使用的是 Windows 操作系统,所以我下载的是 Windows 版,下载 Windows 版 Git.其他操作系统的如:Linux.Mac,可以参考这…

vue开发搭建（npm安装 + vue脚手架安装）

一.概念 1.npm: Nodejs下的包管理器. 2.webpack: 它主要的用途是通过CommonJS的语法,把所有浏览器端需要发布的静态资源,做相应的准备,比如资源的合并和打包. 3.vue-cli: 用户生成Vue工程模板.(帮你快速开始一个vue的项目,也就是给你一套vue的结构,包含基础的依赖库,只需要 npm install就可以安装) 原文:https://www.cnblogs.com/goldlong/p/8027997.html 二.NPM安装 1.下载npm软件,…

手把手教你安装Eclipse最新版本的详细教程 - 大佬的鸡肋，菜鸟的盛宴（非常详细，非常实用）

简介首先声明此篇文章主要是针对测试菜鸟或者刚刚入门的小伙们或者童鞋们,大佬就没有必要往下看了. 写这篇文章的由来是因为后边要用这个工具,但是由于某些原因有部分小伙伴和童鞋们可能不会安装此工具,为了方便小伙伴们和童鞋们的后续学习和不打击他们的积极性,因为80%的人都是死在工具的安装这第一道门槛上,这门槛说高也不高说低也不是太低.所以宏哥就抽时间水了这一篇文章. 第一步:下载eclipse,并安装. 1.首先打开官方地址(见下面) Eclipse官方下载地址:点击打开官方链接下载链接:http:…

在XP上安装WinPython最新版本

2015年3月30日星期一 16:01:47 晴 WinPython 新版本不再支持Windows XP平台,会出现错误提示WindowsError 127. 按照官网论坛上的解决方案(https://github.com/winpython/winpython/issues/17),把Pyzmq的版本(14.5)替换为旧版本(13.0),测试正常. 具体方法如下: 安装最新版本的WinPython-32bit-2.7.9.4,然后安装2013年的最晚版本WinPython-32bit-…

全新安装mysql最新版本

写在前面: 下面写的东西只是最近安装的一个说明,是在系统中没存在mysql的情况下安装的,后期会根据官方文档写一个详细有价值的文档安装原理:利用mysql官方的mysql_apt-repository库进行安装安装方法:1.因为我用的是debian系统,更我下载的是APT-Repository 2.用命令dpkg -i 1中下载的.deb文件 3.安装过程中会提示你选择相应的版本,直接OK即可 4.apt-get update更新一下安装源 5.apt-get install mysql…

mac下安装Python3.*(最新版本)

前言:mac系统自带python,不过以当前mac系统的最新版本为例,自带的python版本都是2.*版本,虽然不影响老版本项目的运行,但是python最新的3.*版本的一些语法与2.*版本并不相同,网上的教程大神们也肯定都更新出了最新版的教程,我们不论是学习还是使用,当然用最新版会更好一点. 转载请注明出处http://www.cnblogs.com/meng1314-shuai/p/9031686.html 1.在安装最新版Python3.*之前,我们先熟悉一下系统自带的python. M…

ansible的playbook进行yum批量安装nginx最新版本

环境:centos7 版本:nginx最新版本软件: ansible 作用: 进行批量执行不同机器上,进行安装nginx版本检查脚本是否正确: [root@ansible-test ansible-yaml]# ansible-playbook --syntax-check nginx.yml 进行执行: [root@ansible-test ansible-yaml]# ansible-playbook nginx.yml hosts: web vars: hello: ansible t…

CentOS7源码安装qbittorrent最新版本

CentOS的软件 yum 里 yum search qbittorrent yum info qbittorrent 找到的是3.37版本官网最新的是4.12版本.但需要源码安装: 官网下载最新版本的压缩包:https://www.qbittorrent.org/qbittorrent-4.1.2.tar.gz解压缩,cd qbittorrent-4.1.2 进入qbittorrent-4.1.2目录,运行./configure 提示如下...checking for Qt5 qmake >…

Ruby windows7安装配置(最新版本)

1.下载最新版本的rubyinstaller并安装http://rubyinstaller.org/downloads/ 如下图所示设置路径,我安装时将所有选项都打够了,免除了后面需要什么配置麻烦. 2.安装完后才能之后去Cmd命令中输入ruby -v ,并看到下图所示版本信息说明安装成功 3.接下来安装获得RubyGems 网址:https://rubygems.org 搜索点击然后选择下载格式并下载到本地解压. 在cmd中输入路径:D:\Software\Ruby\rubygems-2.6.…

安装Mysql最新版本mysql-5.7.10-winx64出现的几个问题解决

电脑是64位的安装不了Windows (x86, 32-bit),Mysql installer MSI ,然后下载了Windows (x86, 32-bit), ZIP Archive 这种是免安装直接解压使用的,因为最新版本的原因也有一些问题. (1) 首先解压后有一个默认的配置文件my-default.ini配置文件,直接替换掉换成以下的配置文件(注意安装路径的更改). [mysql] # 设置mysql客户端默认字符集 default-character-set=utf8 [my…

【Vue踩坑第一步，安装Vue最新版本】的更多相关文章