精华内容
下载资源
问答
  • 如果你是第一次接触,并且想学习vue,建议你使用以下的方式来引入vue。 在你熟悉的目录下创建一个html文件,将以下的代码复制到head标签中即可 <!-- 开发环境版本,包含了有帮助的命令行警告 --> &...

    新手请看这里

    如果你是第一次接触,并且想学习vue,建议你使用以下的方式来引入vue。
    在你熟悉的目录下创建一个html文件,将以下的代码复制到head标签中即可

    <!-- 开发环境版本,包含了有帮助的命令行警告 -->
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    

    或者

    <!-- 生产环境版本,优化了尺寸和速度 -->
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    

    现在我们来在浏览器页面中输入hello vue
    代码实现

    <!DOCTYPE html>
    <html>
    <head>
    	<title>vue学习</title>
    	<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    </head>
    <body>
    	<div id="app">
    		<span>{{message}} welcome to myworld!</span>
    	</div>
    
    	<script type="text/javascript">
    	 var app = new Vue({
    		el:"#app",
    		data:{
    			message:"hello,vue!"
    		}
    	});
    
    	</script>
    </body>
    </html>
    

    运行效果
    好了,到这里我们已经成功创建了第一个 Vue 应用!看起来这跟渲染一个字符串模板非常类似,但是 Vue 在背后做了大量工作。现在数据和 DOM 已经被建立了关联,所有东西都是响应式的。我们要怎么确认呢?打开你的浏览器的 JavaScript 控制台 (就在这个页面打开),并修改 app.message 的值,你将看到上例相应地更新。

    使用脚手架请看这里

    如果需要搭建vue环境的话,必须要基于nodejs,所以我们首先要在电脑上安装nodejs。

    1.nodejs的安装比较简单

    从官网下载node node下载地址
    下载后基本上就是下一步下一步,知道安装成功(需要注意的一点是需要勾选add to path,不然在cmd输入node会提示不是内部命令)

    2.安装vue的脚手架工具 官方命令行工具

    npm install --global vue-cli

    3.创建项目 必须cd到对应的一个项目里面

    <!--vue-demo01是项目名称,自定义-->
    vue init webpack vue-demo01
    <!--进入创建好的项目中-->
    cd  vue-demo01
    <!--  如果创建项目的时候没有报错,这一步可以省略。如果报错了  cd到项目里面运行  -->
    npm install 
    <!--运行项目-->
    npm run dev
    

    最终效果如下
    运行效果

    展开全文
  • 解决: ,然后再重启IDEA

    解决:
    在这里插入图片描述
    ,然后再重启IDEA

    展开全文
  • VUE

    千次阅读 多人点赞 2018-12-04 16:53:47
    VUE学习vue-router安装vue-router编写vue-router的配置文件使vue-router配置生效配置多级路由 vue-router vue-router是用作前端路由的。 安装vue-router npm install vue-router --save 编写vue-router的配置文件 ...

    vue-router

    vue-router是用作前端路由的。

    安装vue-router

    npm install vue-router --save
    

    编写vue-router的配置文件

    在src目录下新建一个router的配置文件router.js (名字自定义):

    // 导入vue
    import Vue from 'vue'
    // 导入vue-router
    import Router from 'vue-router'
    // 导入需要路由的组件
    import Hello from './components/hello/Hello'
    
    // 设置vue-router组件全局使用
    Vue.use(Router)
    
    // 配置组件路由参数信息
    const routes = [
    		{
    			// 组件路由路劲
    			path: '/hello',
    			// 要路由的组件
    			component: Hello,
    			// 取别名,名字自定义
    			name: 'Hello'
    		}
    	]
    
    // 构建路由配置对象
    const router = new Router({
    	routes 
    })
    
    // 导出配置
    export default router
    
    

    使vue-router配置生效

    在main.js中,导入上面配置好的路由信息

    import Vue from 'vue'
    import App from './App'
    // 导入router的配置
    import router from './router'
    
    new Vue({
    // 使配置生效
      router,
      render: h => h(App)
    }).$mount('#app')
    
    

    重启项目,通过ip+端口+ /hello 就能访问到对应的Hello组件了。

    配置多级路由

    import Vue from 'vue'
    import Router from 'vue-router'
    import Hello from './component/Hello'
    import Hi from './component/hi'
    
    //全局使用router
    Vue.use(Router)
    
    const routes = [{
    	{
    		path: '/hello',
    		component: Hello,
    		name: 'Hello',
    		// 每个路由都有一个children标签,用于配置子路由
    		children: [
    			{
    				path: '/hi',
    				component: Hi,
    				name: 'Hi'
    			}
    		]
    	}
    }]
    
    const router =  new Router({
    	routes
    })
    
    export default routes
    

    子路由,其实 就是路由下的一个children属性,在children属性是一个数组,可以配置多个路由,在这个属性中的路由中,还可以配置children属性,达到配置多级路由的效果。

    使用vue-router

    配置好路由信息后,可以通过router-link制作导航,to属性对应配置的path的路径。router-view用来加载(显示)要路由的模板。

    <!--配置路由路径-->
    <router-link to="/hello">hello</router-link> 
    <!--配置路由模板显示地址-->
    <router-view></router-view>
    

    也可以通过路由配置中的name属性实现跳转:

    <!-- to前面一定要写:,只是一个对象,name: 定义的名字,这样就会跳转到指定name的组件上-->
    <router-link :to="{name: 'Hello'}"></router-link>
    <router-view></router-view>
    

    在组件中传值

    注意的是,to前面一定要有:,to的值是一个对象,并且属性是name, params:

    <router-link :to="{name: 'hi', params: {username: 'tom', age: 18} }"></router-link>
    

    在组件中接收参数要用到**$route**:

    <p>   {{ $route.name }}   </p>
    <p>   {{ $route.params }}   </p>
    

    在不同页面加载不同的组件

    配置路径对应的组件,配置router:

    import Vue from 'vue'
    import Router from 'vue-router'
    import Student from './views/Students'
    import Teacher from './views/Teacher'
    
    Vue.use(Router)
    
    const routes = [{
        path: '/user',
        // /user路径下对应了两个组件
        components: {
          Student,
          Teacher
        }
    }]
    
    const router = new Router({
      routes,
      mode: 'history'
    })
    
    export default router
    
    

    使用时,在router-view中指定要显示的是哪个组件:

    <template>
      <div id="app">
        app
        <hr>
        <router-link to="/user">load</router-link>
        <hr>
        <!--通过name属性指定当前router-view要显示的组件-->
        <router-view name="Teacher"></router-view>
        <hr>
        <router-view name="Student"></router-view>
      </div>
    </template>
    

    通过url传递参数

    在定义路由时,要指定传递的url参数名。

    const routes = [{
        path: '/user',
        components: {
          Student,
          Teacher
        }
    }, {
    // 指定参数名,参数名后面加(),里面写正则表达式,可以匹配路径
      path: '/hello/:id(\\d+)/:name',
      component: Hello
    }]
    

    路径跳转:

    <!-- 最终路径显示成:http://192.168.56.1:8081/hello/122/xx -->
     <router-link to="/hello/122/xx">URL</router-link>
     <hr>
     <router-view></router-view>
    

    在组件中获取参数:

    <p>  {{$route.params.id}} </p>
    <p>  {{$route.params.name}} </p>
    

    路由重定向

    路由重定向只需要在路由配置里面加redirect就可以了,重定向也可以携带url参数:

    	{
    		path: '/hi/:id',
    		redirect: '/hello/:id'
    	}
    

    为路径去别名

    使用路由时在router-link的to属性中可以写hi,也可以写/hello,注意不要对根路径/取别名:

    	{
    		path: '/hi',
    		redirect: '/hello',
    		alias: '/hello';
    	}
    

    路径*匹配

    如果有个路径匹配不到,跳转到404页面,注意路径是从上向下匹配的,* 这个匹配应该放到路由最后:

    	{
    		path: '*',
    		component: FileNotFound
    	}
    

    路由独享守卫

    路由钩子函数、守卫,可以控制路由的访问,只要beforeEnter :

    {
        path: '/hello',
        component: Hello,
        name: 'hello',
        // 定义路由信息的时候指定
        beforeEnter (to, from, next) {
          console.log("去到", to.fullPath);
          console.log("来自", from.fullPath);
          // 当调用next()或者next(true)的时候,路由正常跳转
          next(true);
        }
      }
    

    组件内守卫

    钩子函数(守卫)写在组件中, beforeRouteEnter进入路由前,beforeRouteLeave离开组件前:

    // 在组件中
    export default {
        name: 'Hello',
        beforeRouteEnter(to, from, next) {
          console.log("去", to.fullPath)
          console.log("来自", from.fullPath)
          next(true)
        },
        beforeRouteLeave(to, from, next) {
          console.log("去", to.fullPath)
          console.log("来自", from.fullPath)
          next(true)
        }
      }
    

    全局守卫

    前置钩子函数:

    const router = new VueRouter({ ... })
    
    router.beforeEach((to, from, next) => {
      // ...
    })
    

    后置钩子函数,不接受next,不会改变导航本身:

    router.afterEach((to, from) => {
      // ...
    })
    

    动态路由

    this.$router.push()

    <!--绑定一个事件,调用toHello方法-->
    <button @click="toHello">load</button>
    <script>
      export default {
        name: "App",
        methods: {
          toHello() {
          	// 在toHello方法中调用push()方法,方法接收一个参数,路由地址
            this.$router.push('/hello')
          }
        }
      }
    </script>
    

    this.$router.go()

    <button @click="toHello">load</button>
    <script>
      export default {
        name: "App",
        methods: {
          toHello() {
          	// 在toHello方法中调用go()方法,方法接收一个参数,历史记录数,-1表示回退一个历史记录,-2表示回退2个历史,同理整数表示前进
            this.$router.go()
          }
        }
      }
    </script>
    

    this.$router.repalce()

    <button @click="toHello">load</button>
    <script>
      export default {
        name: "App",
        methods: {
          toHello() {
          	// 在toHello方法中调用replace()方法,方法接收一个参数,路由地址,比如当前是路由时/a,我们触发这个方法执行,跳转到/hello,replace方法会替换/a,变成/hello,/a不出现在历史记录中,所以回退的时候不会回退到/a
            this.$router.replace('/hello')
          }
        }
      }
    </script>
    

    Vuex

    简单使用

    安装vuex

    npm install vuex --save
    

    在src下新建store.js

    // 引入vue
    import Vue from 'vue'
    // 引入vuex
    import Vuex from 'vuex'
    
    // 使用vuex
    Vue.use(Vuex)
    
    // 声明状态
    const state = {
      count: 1
    }
    
    // 声明变化 
    const mutations = {
     // 这里对状态中的count修改
      add(state) {
        state.count++
      },
      reduce(state) {
        state.count--
      }
    }
    
    // 创建vuex数据仓库,需要state和mutations两个属性
    const store = new Vuex.Store({
      state,
      mutations
    })
    
    // 暴露仓库
    export default store
    
    

    在组件中引用:(this.$store.commit() 接受mutations中定义的函数,会将接收的函数执行)

    <template>
      <div>
      	<!--调用当前实例的store属性,取出state状态中的count-->
         Count: {{this.$store.state.count}}<br/>
         <!--this.$store.commit接收一个mutations中定义的函数,用户操作state中的数据,这里不能用this调用-->
        <button @click="$store.commit('add')">+</button>
        &nbsp;&nbsp;&nbsp;&nbsp;
        <button @click="$store.commit('reduce')">-</button>
      </div>
    </template>
    <script>
    	// 引入数据仓库
      import store from './store'
    
      export default {
        name: 'Count',
        // 作为当前vue实例属性
        store
      }
    </script>
    
    

    使用vuex的state中的属性

    方式一: 通过$store.state.xxx访问,xxx就是你要访问的数据

    <template>
      <div>
         Count: {{$store.state.count}}<br/>
      </div>
    </template>
    <script>
    	// 引入数据仓库
      import store from './store'
    
      export default {
        name: 'Count',
        // 作为当前vue实例属性
        store
      }
    </script>
    

    方式二:通过计算属性访问,其实也是调用了$store.state.xxx

    <div>
    	{{ count }}
    </div>
    <script>
     import store from './store'
    export default {
       name: 'Count',
       computed: {
       // 计算属性中使用
         count() {
           return this.$store.state.count;
         }
       },
       store
     }
    </script>
    

    方式三:vue 提供了 mapState 函数,它把state 直接映射到我们的组件中。

    <template>
      <div>
        Count:{{ count }}<br/>
      </div>
    </template>
    <script>
      import store from './store'
      // 获取mapState
      import { mapState } from 'vuex'
    
      export default {
        name: 'Count',
        // 映射到组件
        computed: mapState(['count']),
        store
      }
    </script>
    
    

    上面的方式不能自己写其他计算属性了,如果要写其他计算属性,可以用下面的写法:

    computed: {
         localComputed() { 
    
         },
         // 映射
          ...mapState({
            count: 'count'
          })
        },
    

    修改state中的状态

    修改状态state需要用到mutations属性,mutations中定义函数,函数的第一个参数时默认的,为state,第二个参数可以是一个对象。可以通过state获取state中的属性

    import Vue from 'vue'
    import Vuex from 'vuex'
    
    Vue.use(Vuex)
    
    const state = {
      count: 3
    }
    
    // 定义操作state的函数
    const mutations = {
    	// 第一个参数是默认的,之后的参数是自定义的
      add(state, n) {
        state.count += n
      },
      reduce(state, obj) {
        state.count = state.count + obj.n + obj.m
      }
    }
    
    const store = new Vuex.Store({
      state,
      // 在mutations中定义一些函数操作state
      mutations
    })
    

    调用定义的函数操作state:

     <button @click="$store.commit('add', 10)">+</button>
     <button @click="$store.commit('reduce', {n: 10, m: 20})">-</button>
     <script>
      import store from './store'
      import { mapState } from 'vuex'
    
      export default {
        name: 'Count',
        store
      }
    </script>
    

    使用mapMutations:

    <template>
      <div>
        Count: {{$store.state.count}}<br/>
        <button @click="add(11)">+</button>
        <button @click="reduce({n: 10, m: 20})">-</button>
    
      </div>
    </template>
    <script>
      import store from './store'
      // 引入mapMutations
      import { mapMutations } from 'vuex'
    
      export default {
        name: 'Count',
        // 传入方法名即可
        methods: mapMutations(['add', 'reduce']),
        store
      }
    </script>
    
    

    为了能自定义方法,也可以这样写:

    <template>
      <div>
        Count: {{$store.state.count}}<br/>
        <button @click="add(11)">+</button>
        <button @click="reduce({n: 10, m: 20})">-</button>
    
      </div>
    </template>
    <script>
      import store from './store'
      import { mapMutations } from 'vuex'
    
      export default {
        name: 'Count',
        methods: {
        	// 自定义方法
          my() { },
          // mapNuutations的用法
          ...mapMutations(['add', 'reduce'])
        },
        store
      }
    </script>
    
    

    getters

    设置getters

    import Vue from 'vue'
    import Vuex from 'vuex'
    
    Vue.use(Vuex)
    
    const state = {
      count: 3
    }
    
    const mutations = {
      add(state, n) {
        state.count += n
      },
      reduce(state, obj) {
        state.count = state.count + obj.n + obj.m
      }
    }
    
    // 定义getters
    const getters = {
      count(state) {
        return state.count += 100
      }
    }
    
    
    const store = new Vuex.Store({
      state,
      mutations,
      // 使用getters
      getters
    })
    
    export default store
    
    

    使用getters:

    <template>
      <div>
      	<!--要通过这种方式 访问-->
        Count: {{count}}<br/>
      </div>
    </template>
    <script>
      import store from './store'
      // 引入getters
      import { mapMutations, mapGetters } from 'vuex'
    
      export default {
        name: 'Count',
        methods: {
          my() { },
          ...mapMutations(['add', 'reduce'])
        },
        // 在计算属性中使用..
        computed: {
        	// 使用getters
          ...mapGetters(['count'])
        },
        store
      }
    </script>
    
    

    action异步执行

    import Vue from 'vue'
    import Vuex from 'vuex'
    
    Vue.use(Vuex)
    
    const state = {
      count: 3
    }
    
    // 定义方法
    const mutations = {
      add (state, n) {
        state.count += n
      },
      reduce (state, obj) {
        state.count = state.count - obj.n - obj.m
      }
    }
    
    // 声明action,声明要异步执行的函数
    const actions = {
    // 传入的是context对象
      add (context) {
        context.commit('add', 0.1)
      },
      // 或者是{commit}
      reduce({commit}, n) {
        commit('reduce', n )
      }
    }
    
    const store = new Vuex.Store({
      state,
      mutations,
      actions
    })
    
    export default store
    
    

    使用:

    <template>
    	Count: {{count}}<br/>
        <button @click="add">+</button>
        <button @click="reduce({n: 1, m :2})">-</button>
    </template>
    <script>
      import store from './store'
      // 导入
      import { mapActions, mapState } from 'vuex'
    
      export default {
        name: 'Count',
        methods: {
          my () {
          },
          // 使用
          ...mapActions(['add', 'reduce'])
        },
        computed: {
          ...mapState(['count'])
        },
        store
      }
    </script>
    
    展开全文
  • 问题:因为每次更换开发环境时,都需要手动重启一次服务器。以下的方法可以实现自动化重启。 一、安装nodemon插件 nodemon插件,这里有一篇详细的入门介绍。 这里只有我的配置进行记录。... "serve": "vue-cli-servi

    问题:因为每次更换开发环境时,都需要手动重启一次服务器。以下的方法可以实现自动化重启。

    一、安装nodemon插件

    nodemon插件,这里有一篇详细的入门介绍
    这里只有我的配置进行记录。

    1. 首先我们需要在开发环境中安装nodemon依赖 npm install --save-dev nodemon
    2. 在项目的package.json文件中的scripts对象下添加开启nodemon的操作
    // package.json
    
    "scripts": {
       "serve": "vue-cli-service serve",
       "build": "vue-cli-service build",
       "lint": "vue-cli-service lint",
       "dev": "vue-cli-service serve",
       "start": "nodemon"
     },
    
    1. 在项目根目录下创建nodemon.json文件
    // nodemon.json
    
    {
      "ignore": ["node_modules", "dist"],
      "exec": "vue-cli-service serve",
      "watch": ["proxy.js"]
    }
    

    其中,ignore是指不进行监听的文件;exec是监听到文件变化后执行的代码;watch是监听的文件名

    在运行项目时,需要顺便运行nodemon,即npm run start,之后在更改proxy,js文件时就会自动跑一遍npm run serve重启服务器。

    二、Webpack Dev Server 4.0.0版本中的watchFiles

    watchFiles可以设置监听文件,如果文件发送改变就自动重启服务器
    devServer: { watchFiles: ['src/**/*.php', 'public/**/*'], },

    展开全文
  • Vue中更改vue.config.js配置文件,一定要重启!!或者配置项更改并不会生效!!!
  • 实时打包项目方法: ...监控src文件夹下所有的html/vue/js/less文件 有更改则自动打包 "scripts": { "dev": "node build/dev-server.js", "dist": "nodemon --watch src -e html,vue,js,less build...
  • 到项目目录,vue init webpack “项目名称” 然后得到是一个最基础的vue的代码 ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190416145731204.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5...
  • 如图所示: 1.插件安装成功图例如下: ![图片说明](https://img-ask.csdn.net/upload/202004/25/1587783439_203983.png) 2. 新建工程时,static web下的显示情况如下: ![图片说明]...
  • vue-vueadmin记录

    千次阅读 2019-09-23 19:14:19
    title: vue-vueadmin记录 categories: Vue tags: [vue, vueadmin, js, 记录] date: 2019-09-06 17:37:10 comments: false vue-vueadmin记录 相关资料 官方资料 GitHub - ...
  • 安装vueVUE命令失效

    2021-03-15 10:12:41
    一、问题描述 1、安装nodejs 2、检验nodejs是否安装成功:npm -v 3、安装vue手脚架:npm install -g vue-cli 4、检验vue是否安装...4、重启命令窗口,输入vue检验vue是否安装成功(出现属性,即为安装成功) .
  • 下载插件文件:https://github.com/vuejs/vue-syntax-highlight 直接在官网下载放在安装时候的packages目录下(sublime text3\Sublime Text3\Data\Packages) 在Packages文件夹下新建一个vue的文件,把第...重启ok...
  • vue cli 3 升级到 vue cli 4 方法步骤及升级点总结

    万次阅读 多人点赞 2019-10-26 18:45:44
    vue cli 3 升级到 vue cli 4 指南 vue cli 3 升级到 vue cli 4 方法步骤及升级点总结 vue-cli 3升级vue-cli 4 官方英文升级文档,中文滞后 一.首先,在全局安装最新的 Vue CLI: npm install -g @vue/cli # OR yarn ...
  • 描述:之前启动vue项目报错但是可以访问,使用lsof -i port 找到项目对应端口和进程,用kill -9 进程号 杀死进程,再次访问本机该对应端口,仍然可以访问。。。。 解决办法:用sudo lsof -i 找到node对应你之前无法...
  • Vue脚手架

    2019-11-12 21:25:54
    Vue脚手架的基本用法 Vue脚手架可以快速生成Vue项目基础的架构。其官网地址为:https://cli.vuejs.org/zh/ 使用步骤: A.安装3.x版本的Vue脚手架: npm install -g @vue/cli B.基于3.x版本的脚手架创建Vue项目: 1...
  • vue入门

    千次阅读 2020-02-13 21:06:16
    会创建Vue实例,知道Vue的常见属性 会使用Vue的生命周期的钩子函数 会使用vue常见指令 会使用vue计算属性和watch监控 会编写Vue组件 掌握组件间通信 了解vue-router使用 0.前言 前几天我们已经对后端的技术栈有了...
  • vue chrome插件

    2020-12-09 11:11:42
    vue chrome插件,现在好压缩包之后,解压到nodejs根目录,打开chrome设置-》扩展程序=》打开开发者模式,点击加载已解压的扩展程序,选择nodejs下面解压好的vue插件,重启浏览器就可以了
  • Vue入门

    2020-02-05 21:46:30
    文章目录1. MVVM 模式1.1 MVVM 模式的概念1.2 MVVM 模式的作用1.3 MVVM 模式的... Vue 快速入门4.1 创建工程4.2 安装 Vue4.3 Vue 入门案例4.3.1 Vue 声明式渲染4.3.2 双向绑定4.3.3 事件处理5. Vue 实例5.1 创建 V...
  • 安装vue环境 输入vue list时 出现 vue-cli · read ECONNRESET解决方法 重启就好 嘻嘻 我就是这样 不知道为啥 看到最后的帮忙点个赞???????? 谢谢!
  • 0.安装之 npm install -g @vue/cli 检测是否安装成功 vue -V(大写大写的V) 报了倒霉的“vue不是内部外部命令,也不是可运行的程序” 这说明vue.cmd不在window系统的环境变量里面 ...重启终端,vue -...
  • IntelliJ IDEA安装vue插件 ...安装完成,重启IDEA即可。 为了解决项目报错,需要设置编译环境为ES6。 IntelliJ IDEA导入vue项目 打开File -> Open,选择vue项目的文件夹,等待一会,等项目初始化完成,启动项目即
  • ③安装成功后点击右下角Apply 提示重启webstorm 重启完成后 Setting-Editor-File and Code Templates 点击右上角的加号 添加vue文件 Name为vue File, Extension 为vue,下面的位置可以填写自定义的初始化模板内容 ...
  • vue实现PC端分辨率适配

    万次阅读 多人点赞 2019-07-25 16:12:23
    项目基础配置使用 vue-cli 生成 自适应方案核心: 阿里可伸缩布局方案 lib-flexible px转rem:px2rem,它有webpack的loader px2rem 开始 先使用vue脚手架初始化一个webpack项目 vue init webpack 项目名 项目初始化...
  • 说实话都是逼出来的,对于前端没干过ES6都不会的人,vue视频也就看了基础的一些 但没办法,接下来做微服务架构,前端就用 vue,这块你负责。。。。说多了都是泪,脚手架框架布了都没看过 干就完事,不过好在做好了,...
  • vue部署

    2021-04-20 20:46:46
    vue部署 1、配置vue目录 在vue项目config/index.js文件中 找到 build部分的assetsPublicPath 修改值为"./" build: { // Template for index.html index: path.resolve(__dirname, '../dist/index.html'), // ...
  • vue2.0升级vue3.0报错

    2019-08-01 12:31:10
    vue2.0升级vue3.0报错 报错误[Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the ...
  • 1.电脑和手机连接同一个...3.vue.config.js devServer设置host为ip地址(vue-cli 4 之前的版本设置位置不同) module.exports = { devServer: { host: '192.168.43.217', }, }; 4.重启项目 5.手机输入该地址 ...
  • idea vue插件

    2018-04-12 10:17:41
    由于idea下载vue经常会因为超时而下载不成功,故从idea官网下载2018.04.08版本的vue插件,解压到idea安装目录下plugins重启idea既可使用
  • Vue3+与Vue2共存

    千次阅读 2020-05-04 21:57:53
    目前大多数新项目都会采用Vue3+进行开发,然而在公司还需要维护一些之前使用老旧版本Vue2开发的项目,此时则需要我们在电脑上安装vue2与vue3+了。 1、 先来说说npm安装命令的参数-g -g参数可以将js包进行全局安装,...
  • :vulcan_salute: 2019.05.17 v1.2发布,修复了不能重启的bug(已删除) :vulcan_salute: 2019.06.09 v2.1发布,美化了界面(已删除) :vulcan_salute: 2019.06.27 v2.3更新(已删除) :atom_symbol_selector:...
  • 1.安装vue-resource模块 ...2.重启vue npm run dev 3.在main.js中引入vue-resource模块 import VueResource from 'vue-resource' 5.在main.js中使用VueResource Vue.use(VueResource) ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 18,062
精华内容 7,224
关键字:

vue重启

vue 订阅