vue2/vuex2的那点坑
说是坑,其实大部分是我们自己的过错!
vuex官方demo在1.0可以运行,在2.0报错?
此类问题,应该很常见吧?
还有顺溜的利用1.0搭建的webpack编译环境到了vue2.0突然失效了,报错了?简直要疯啊
1.问题一
*Failed to load resource: net::ERR_FILE_NOT_FOUND
*app.js:16381 Uncaught SyntaxError: Unexpected token import
可能你会疑惑,webpack中明明写了 babel 加载器,query中也写了参数presets,然而 es6 的 import依然不识别,这是为什么呢?
答案是如果你的 include 路径没写错,那么 你就应该添加 .babelrc 的配置文件,比如:
|
1
2
3
4
|
{
"presets": ["es2015", "stage-2"],
"comments": false
}
|
2.问题二
Failed to mount component: template or render function not defined
这是什么问题呢?因为是2.0的时代了,但我们没认真看api,可能顺手用了1.0的习惯,很明显template or render是 模版编译渲染问题。
官方文档解释 独立构建-vs-运行时构建 解释的多么清楚,一定要看文档
默认 NPM 包导出的是 运行时 构建。为了使用独立构建,在 webpack 配置中添加下面的别名:
|
1
2
3
4
5
|
resolve: {
alias: {
'vue$': 'vue/dist/vue.js'
}
}
|
3.问题3
vuex官方demo在1.0可以运行,在2.0报错?
[Vue warn]: Property or method “counterValue” is not defined
这又是什么原因呢,因为用着 vue2.0和 vuex2.0 却 使用着 vuex1.0 的语法文档。
什么也不说了,看文档吧 Vuex2 中文文档
这里有写的一个vuex2 demo预览 ,demo源代码 直接使用,无需安装webpack打包,无模块.
vue2/vuex2的那点坑的更多相关文章
- vuex2.0.0爬坑记录 -- mutations的第一个参数state不能解构
今天在学习vuex的过程中,遇到了一个很困扰人的问题,最终利用vuex的状态快照工具logger解决了问题. 问题是这样的,我在子组件中使用了mapState()函数来将状态映射至子组件中,使子组件能 ...
- Vue2.0 新手完全填坑攻略——从环境搭建到发布
Jinkey原创感谢 showonne.yubang 技术指导Demo 地址:http://demo.jinkey.io/vue2源码:https://github.com/Jinkeycode/vu ...
- 基于vue2+vuex2+vue-router+axios+elementUI做的自动化后台模板
github地址:https://github.com/sailengsi/sls-admin 此项目重点突出在架构上模式,这个架构模式,可以让我们在开发中,很方便的拓展与维护,并且可以保持结构清晰的 ...
- vue使用中遇到的,以及vue1.0到vue2.0新手踩的坑
最近再写一个vue的项目,视频中用的是vue1.0,但是现在vue已经2.0,所以踩了很多坑,先记录下来.理解有误再来修改. 路由问题 之前的路由是写在app.vue里边,而2.0的路由直接有个rou ...
- [Vue] Vue2 + @vue/composition-api 的一个坑
Vue2 + @vue/composition-api 和 Vue3 composition api 不一致的地方(待验证) <div v-for="item in arr" ...
- Vue2.0 新手完全填坑攻略—从环境搭建到发布
http://www.open-open.com/lib/view/open1476240930270.html https://jingyan.baidu.com/article/91f5db1b2 ...
- Vue2.0 新手完全填坑攻略——从环境搭建到发布(转载)
强力推荐,详情请点击此链接http://www.jianshu.com/p/5ba253651c3b
- (转)Vue2.0 推荐环境
Vue2.0 新手完全填坑攻略——从环境搭建到发布 http://www.jianshu.com/p/5ba253651c3b Jinkey原创感谢 showonne.yubang 技术指导Demo ...
- Vue 全家桶学习资源(转)
companion: React 全家桶学习资源(持续更新) 下面整理了一些关于Vue以及Vue衍生的学习资源: 官网文档 官网API ECMAScript 6 入门 30分钟掌握ES6/ES2015 ...
随机推荐
- NFS指定端口
nfs服务端: 编辑/etc/nfsmount.conf,在末尾添加: RQUOTAD_PORT=30001LOCKD_TCPPORT=30002LOCKD_UDPPORT=30002MOUNTD_P ...
- Spring.net 配置说明
Spring.net使用说明 使用方法: 1.在配置文件设置Spring.net 节点 在配置节中,声明Spring.net,配置 context,objects 标签,来源(type) < ...
- [LeetCode] Implement Stack using Queues 用队列来实现栈
Implement the following operations of a stack using queues. push(x) -- Push element x onto stack. po ...
- Tomcat基于虚拟路径的发布和web.xml配置
<Connector port="8888" protocol="HTTP/1.1" connectionTimeout="20000" ...
- Android零碎知识
1.当启动一个APP时按下后退键会调用onBackPressed方法. 如果想要屏蔽后退键只需要重写onBackPressed方法如下即可: @Override public void onBackP ...
- 【BZOJ 4579】【Usaco2016 Open】Closing the Farm
http://www.lydsy.com/JudgeOnline/problem.php?id=4579 把时间倒过来,只是加点,并查集维护连通块. #include<cstdio> #i ...
- ABP文档 :Overall - Module System
模块介绍 ABP提供了构建模块并将这些模块组合起来创建应用的基础设施.一个模块可以依赖另一个模块.一般来说,一个程序集可以认为是一个模块.如果应用中有多个程序集,建议为每个程序集创建一个模块定义.模块 ...
- jQuery 树形菜单
树形菜单 在 jQuery easyu中其左侧的主菜单使用的是 easyui 中的 tree 组件,不是太熟悉,不过感觉不是太好用. 比如 easyui 中的 tree 需要单击分叉节点前的小三角,才 ...
- 冰冻三尺非一日之寒--web来了
第十四章 html css 1-1Html和CSS的关系学习web前端开发基础技术需要掌握:HTML.CSS.JavaScript语言.下面我们就来了解下这三门技术都是用来实现什么的:1. H ...
- 分享一种容易理解的js去重排序方法
<script> var arr=[1,8,6,4,88,22,99,4,6,86,5,58,89,5]; //先使用sort()函数去重 var a=arr.sort(function ...