vue中脚手架的使用详解(@vue-cli、@vue/cli)

                安装步骤：
                    1 全局安装@vue/cli
                    npm install @vue/cli -g        vue --version  查看vue脚手架是否安装成功

                    2 创建项目
                    vue create 自定义项目名

                    3 进入项目 并且 运行项目
                    cd 自定义项目名
                    npm run serve


                public      index.html 
                src
                    assets     静态资源(图片 视频 音频 js代码 css样式 ...)
                    components 存放普通组件
                    router     配置路由文件
                    views      存放路由组件
                    app.vue
                    main.js

                    1 全局安装 vue-cli
                    npm install --global vue-cli
                    
                    2 创建一个基于webpack 模板的新项目
                    vue init webpack 自定义项目名

                    3 进入项目目录 并且运行项目
                    cd 自定义项目名
                    npm run dev

                    build                   执行打包压缩的文件
                    config                  全局配置文件
                    node_modules            当前项目里边所需要的依赖包
                    src                     当前vue项目的核心文件
                        assets              静态资源(图片 视频 音频 js代码 css样式 ...)
                        components          当前项目中所有的普通组件都需要存放当前文件
                        router              配置是当前vue项目的路由配置
                        app.vue             全局主入口vue文件
                        main.js             全局主入口js文件
                    index.html              当前项目的首页(根节点)  vue是单页面应用 
                    package.json            里边是当前项目的相关基本配置选项

                    以后写项目的时候 我们一般操作的是在src文件中编写你的项目

                    在vue项目中 普通组件都存放在components   
                    所有的路由组件都存放在views

                    1 直接在vue-cli中安装axios
                    npm i axios --save-dev
                    2 在需要请求数据的组件中引入axios
                    import axios from 'axios'
                    3 在需要使用axios位置上 写上 axios.get()  axios.post()

                    1 安装axios
                    npm i axios --save-dev
                    2 在main.js文件中引入axios
                    import axios from 'axios'
                    3 将axios设置给vue原型对象
                    Vue.prototype.axios=axios
                    4 在需要使用axios的位置上直接写上this.axios.get()

                    1 安装axios vue-axios
                    npm i axios vue-axios --save-dev
                    2 在main.js中引入axios vue-axios
                    import axios from 'axios'
                    import VueAxios from 'vue-axios'
                    3 调用Vue.use()方法
                    Vue.use(VueAxios, axios)  // 先后顺序不要给我写错
                    4 在需要使用axios的位置上直接写上this.axios.get()

            注意安装的vue-router版本号 (3.0.0)
            1 安装vue-router
            npm install vue-router --save-dev
            2 创建一个router.js文件 引入vue-router
            import VueRouter from 'vue-router'
            3 在router.js文件中引入vue  并且使用vue.use()方法调用VueRouter
            vue.use(VueRouter)
            4 在router.js中创建router实例对象并且导出
            const routes=[
                {
                    path: '/',
                    component: index
                }
            ]
            const router=new VueRouter({
                routes
            })
            
            export default router
            5 在main.js文件中引入并且创建router实例
            import router from './router'
            new Vue({
                el: "#app",
                router,
                ...
            })