npm run dev 错误提示:
{ parser: "babylon" } is deprecated; we now treat it as { parser: "babel" }.
治标的解决方法:
找到你的工程文件夹里的 YourProName\node_modules\vue-loader\lib\template-compiler\index.js
//将以下代码
if (!isProduction) {
code = prettier.format(code, { semi: false, parser: 'babylon' })
}
//修改为:
if (!isProduction) {
code = prettier.format(code, { semi: false, parser: 'babel' })
治本的解决方法:
{ parser: "babylon" } is deprecated; we now treat it as { parser: "babel" } 是prettier版本导致的,
直接在项目中:
cnpm install prettier@~1.12.0 -D 或者cnpm install prettier@~1.12.0 --save-dev
然后重新npm run dev
.sass安装报错处理
npm rebuild node-sass
安装完成后,运行时出现了错误
Modele build failed: TypeError: this.getResolve is not a function at Object.loader...
这是因为当前sass的版本太高,webpack编译时出现了错误,这个时候只需要换成低版本的就行。 解决办法:
npm install sass-loader@7.3.1 --save-dev
关于vue官网上的生命周期的说明
大致划分一下分为创建前/后,挂载前/后,更新前/后,销毁前/后这四个阶段。各个阶段的状态总结如下:
- beforeCreate:在beforeCreate生命周期执行时,data和methods中的数据还未初始化,所以此时不能使用data中的数据和methods中的方法
- create:data 和 methods初始化完毕,此时可以使用methods 中的方法和data 中的数据
- beforeMount:template模版已经编译好,但还未挂载到页面,此时页面还是上一个状态
- mounted:此时Vue实例初始化完成了,DOM挂载完毕,可以直接操作dom或者使用第三发dom库
- beforeUpdate: 此时data已更新,但还未同步页面
- updated:data和页面都已经更新完成
- beforeDestory:Vue实例进入销毁阶段,但所有的 data 和 methods ,指令, 过滤器等都处于可用状态
- destroyed: 此时组件已经被销毁,data,methods等都不可用
根据以上介绍,页面第一次加载时会执行 beforeCreate, created, beforeMount, mounted这四个生命周期,所以我们一般在created阶段处理http请求获取数据或者对data做一定的处理, 我们会在mounted阶段操作dom,比如使用jquery,或这其他第三方dom库。其次,根据以上不同周期下数据和页面状态的不同,我们还可以做其他更多操作,所以说每个生命周期的发展状态非常重要,一定要理解,这样才能对vue有更多的控制权
mounted钩子函数中请求数据导致页面闪屏问题
其实就是加载时机问题,放在created里会比mounted触发早一点,如果在页面挂载完之前请求完成的话就不会看到闪屏了
IE9中template标签使用问题
之前在tr标签里面用template标签包裹td标签,出现了比较严重的UI错乱, 所以。。IE9不能在tr标签中使用template标签
vue 项目启动时报错:TypeError: Cannot destructure property compile of ‘undefined’ or ‘null’.
原因: webpack-dev-server 版本过高,解决如下:
npm install -D webpack-dev-server@3.0.0
vue中父组件prop传值给子组件,子组件接收不到
父组件用prop传值给子组件,子组件接收不到, 但是随便在子组件created中打印或者注释掉一行console.log,就会接受到传来的值; 解决:(v-if有值再渲染)