vue项目main.js使用方法
vue项目里面main.js文件的基础用法
·
main.js文件解析
- src/main.js是入口文件,主要作用是初始化vue实例并使用需要的插件
- 在main.js文件中定义了一个vue对象,其中el为实例提供挂载元素
//基础配置
import Vue from ‘vue'
//引入已经配置好的路由和vuex
import router from './router'
import store from './store/store'
import App from './App'
//实例化一个Vue,挂载到id为app的div里面,这个vue实例有个局部组件App
const myVue = new Vue({
el: '#app’,
router,
store,
components: { App },
template: '<App/>',
data() {
return {
globaluserAgent: ''
}
},
created() {
}
})
//其他js文件可以引用main.js的myVue实例从而调用myVue的router、store等等
export default myVue
公共方法申明
//将axios设置成全局共用
import * as axios from './axios'
// 全局调用axios添加vue的实例方法
Vue.prototype.$axios = axios
//使用方式就可以是this.$axios.调用接口方法
//通过vue.use使用插件
import VueAwesomeSwiper from 'vue-awesome-swiper'// 轮播图插件
Vue.use(VueAwesomeSwiper)
//vue实例注册,要注意在js文件里无法使用(除非引入了vue),这里可以使用window去注册使用
import allUrl from './config/config'
window['getUrl'] = () => {
return allUrl
}
//使用方式window.getUrl().方法名
其他问题
- vue项目脚手架自动生成:Vue.config.productionTip = false
Vue.config.productionTip = false
上面这行代码的意思 是阻止显示生产模式的消息,作用是来关闭生产模式下给出的提示。
开发模式:npm run dev是前端自己开发用的
生产模式:npm run build 打包之后给后端放在服务端上用的
如果没有这行代码,或者设置为true,控制台就会多出这么一段代码。
You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
更多推荐
已为社区贡献5条内容
所有评论(0)