laravel的blade模板里使用vue,需要遵循一定的加载顺序
最好的办法是先用vue官网的脚本和例子试验一下,摸索出加载顺序了,再用webpack编译出的app.js。 因为app.js里包含了非常多的东西,直接联调就很困难
这里比较邪门的一个事儿,在resources/assets/js/app.js里
import './bootstrap';
Vue.component(
'passport-clients',
require('./components/passport/Clients.vue')
);
new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
});
这里如果把el: '#app' 改成 el: '#zhangsan', 再跑一遍npm run dev,
是看不到zhangsan这个变化的,blade里还用的是上次编译的app,一直提示找不到app这个element
解决办法是在package.json里写一个脚本命令
"clean": "rimraf ./dist && mkdir dist"
再加
"predev": "npm run clean",
这样每次npm run dev之前会先自动跑 npm run clean

网友评论