分类 Vuejs 下的文章

If you look at https://cli.vuejs.org/guide/cli-service.html it tells you that after installing @vue/cli-service ( which may be part of the standard CLI installation ) then vue-cli-service is available in npm scripts, but that if you want to access it directly then you need to use ./node_modules/.bin/vue-cli-service This worked for me, and I guess you could add ./node_modules/.bin to your $PATH if you were so inclined.

- 阅读剩余部分 -

这个有误,需要更新,不是所有的都可以这样写

Vue显然是单例模式,所以任何地方new出来的,都是同样一个Vue实例,所以可以单独设置一个directory,叫做plugins,里面写上各种plugin。

例如:

// vee-validate.js
import Vue from 'vue';
import VeeValidate from 'vee-validate';
Vue.use(VeeValidate);

如果我们使用auth0或者okta等第三方提供的IDaas,那么就要设置一下callback url。

通常,有一个参数是response_mode,默认是query,所以通常是忽略的,但如果你用vuejs,Reactjs或者Angular等构建的SPA,通常用到routerhash mode,那么这个时候就会导致报错,因为单纯的静态页面,url #后面的部分会被忽略,我目前还没搞明白到底是被浏览器忽略,还是auth0的服务器,还是其他什么地方忽略掉了。总之就总是不能执行这个带#的callback。(2018年11月23日更新:应该是auth0的服务器不认这个带#的callback url)
如果实在想用这个#,也可以的,但要配置一下:
https://developer.okta.com/docs/api/resources/oidc

我配置了,就是response_mode: 'fragment',然后不好使。我高度怀疑是需要一个server才能生效的。总之,只有history mode才生效。

好,那就用history模式呗。

但我的小app,

- 阅读剩余部分 -

比如vue-router,可以在多个地方写router hook,比如可以写全局guard,可以per-route写guard,甚至可以在component里写。

那么,在component里写,似乎不错,但一些hook,比如beforeRouteEnter,是不能用到这个component本身的,因为:

The beforeRouteEnter guard does NOT have access to this, because the
guard is called before the navigation is confirmed, thus the new
entering component has not even been created yet.

一开始非常简单,直接把tracking script粘贴到public/index.html的head里,结果发现只是追踪这一页而已,因为所有变化都是在<div id="app"></div>里,所以你看不出来用户到底干嘛了,当然也根本追踪不了page view这些指标啊。

至少我是这么认为的。我为什么这么认为呢?因为我更新代码后,看了一下Google Analytics数据,发现只有1个pageview,这显然不对嘛,怎么可能就一个pageview呢。所以才恍然大悟。

于是就装了一个插件:vue-analytics,不知道效果咋样,但应该比粘贴到index.html里强吧。