插件
插件.js
(function () {
//需要向外暴露的插件对象
const MyPlugin = {};
//插件对象一定要有一个install()
MyPlugin.install = function (Vue, options) {
//添加全局方法
Vue.myGlobalMethod = function () {
console.log('myGlobalMethod')
}
//添加指令
Vue.directive('my-directive', function (el, binding) {
el.textContent = binding.value.toUpperCase();
})
//给实例添加方法
Vue.prototype.$myMethod = function () {
console.log('$myMethod')
}
}
//向外暴露
window.MyPlugin=MyPlugin;
})()
插件.html
<body>
<div id="app">
<p v-my-directive="msg"></p>
</div>
<script src="../vue.js"></script>
<script src="./插件.js"></script>
<script>
//声明使用插件
Vue.use(MyPlugin)//内部会执行MyPlugin.install(Vue)
Vue.myGlobalMethod();
const vm = new Vue({
el: '#app',
data: {
msg:'I Like You'
}
})
vm.$myMethod();
</script>
</body>
使用vue-cli创建项目
npm install -g vue-cli
vue init webpack vue_demo
cd vue_demo
npm install
npm run dev
访问http://localhost:8080/
打包发布
npm run build
npm install -g serve
serve dist
访问:http://localhost:5000/
eslint
去除多余的错误检查
1.在.eslintrc.js的文件内
rules:{'indent':'off'}//添加
2.在eslintignore文件内
*.js
*.vue//添加
最后重新npm run dev