Vue.js之CLI框架安装步骤

本文主要为大家分享一篇Vue.js之CLI框架安装步骤的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧。

一、 检查node是否安装

  1)如果不确定自己是否安装了node,可以在命令行工具内执行: node -v  (检查一下 版本,node与- 中间有空客);

Vue.js之CLI框架安装步骤

2)如果 执行结果显示: xx 不是内部命令,说明你还没有安装node , node 安装地址:http://nodejs.cn/download/

注 :下载相应的node就行;

二、 vue-cli 全局安装

 命令行执行 : npm install -g vue-cli    // 加-g是安装到全局

安装完成以后 可以输入命令 :vue 回车,可以看到针对vue的命令行;

Vue.js之CLI框架安装步骤

 

三、初始化项目

执行命令: vue init webpack demo(你新建的项目名称/文件名称)

执行之后将会 自动初始化一个文件夹 :demo(需要悬着Y/N的时候根据个人需要安装,选择NO 以后也可以手动安装)

 Vue.js之CLI框架安装步骤

找到demo文件夹 可以看到 已经初始化好了 一个基本的项目:

Vue.js之CLI框架安装步骤

 

四、启动项目

  如上图所示,执行初始化项目以后,下面会有对应的命令:

 Vue.js之CLI框架安装步骤

继续执行: cd demo (这是进入到demo文件夹的命令)

 然后执行 安装 :npm install

 Vue.js之CLI框架安装步骤

注: npm install 执行可以进行vue已经vue的插件安装,在第三步的时候,已经初始化了项目,并且在 package.json 里面已经有相关配置,所以在这里可以直接安装;

 安装完成之后再执行命令: npm run dev 

整个项目就已经启动了:

Vue.js之CLI框架安装步骤

以上就是Vue.js之CLI框架安装步骤的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2778016.html

(0)
上一篇 2025年3月8日 15:17:02
下一篇 2025年3月8日 15:17:11

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • 基于vue.js和webpack的Chat示例

    本篇文章给大家分享了关于基于vue.js和webpack的chat示例 ,有感兴趣的小伙伴可以看一下这里的内容 todomvc看腻了,周末花时间做了一个基于Vue + Webpack构建的简单chat示例,聊天记录保存在localStorg…

    2025年3月8日
    200
  • Vue.js—条件渲染

    本篇文章给大家分享了关于vue.js—条件渲染 ,有需要的朋友可以看一下本篇文章的内容 v-if 在字符串模板中,比如 Handlebars,我们得像这样写一个条件块: {{#if ok}}    Yes{{/if}} 登录后复制登录后复制…

    编程技术 2025年3月8日
    200
  • Vue.js条件渲染详解

    本文主要和大家分享vue.js条件渲染详解,在字符串模板中,比如 handlebars,我们得像这样写一个条件块: {{#if ok}}    Yes{{/if}} 登录后复制 在 Vue 中,我们使用 v-if 指令实现同样的功能: Ye…

    编程技术 2025年3月8日
    200
  • 简单理解Vue条件渲染_vue.js

    这篇文章主要帮助大家简单理解vue条件渲染,什么是vue条件渲染,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 一、v-if显示单个元素 注意else只能跟在v-if或者v-show后面 nbsp;html>   Vue条件渲染 …

    编程技术 2025年3月8日
    200
  • 详解在Vue组件中的data为什么只能返回函数

     通过Vue构造器传入的各种选项大多数都可以在组件里用,唯独只有data选项有区别,在Vue构造器中data返回的是对象,但是在组建中必须返回一个函数。why?这篇文章主要介绍了详解在Vue组件中的data为什么只能返回函数,小编觉得挺不错…

    编程技术 2025年3月8日
    200
  • vue.js如何实现组件的双向绑定

    这篇文章主要介绍了vue.js如何实现组件的双向绑定,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧 概述:组件通信通过props,props默认单向绑定(父->子),除了发布订阅事件,另一个通信的方法双向…

    2025年3月8日
    200
  • vue.js实现操作class的方法

    这次给大家带来vue.js实现操作class的方法,vue.js操作class的注意事项有哪些,下面就是实战案例,一起来看一下。 最近使用vue需要实现一个点餐选择商品规格的页面,需要通过vue动态的给被点击的元素添加class名字,使其变…

    2025年3月8日
    200
  • Vue.js的基础知识点总结

    这次给大家带来Vue.js的基础知识点总结,使用Vue.js基础知识的注意事项有哪些,下面就是实战案例,一起来看一下。 对大部分人来说,掌握Vue.js基本的几个API后就已经能够正常地开发前端网站。但如果你想更加高效地使用Vue来开发,成…

    编程技术 2025年3月8日
    200
  • vuejs项目打包后可能会出现的问题有哪些

    这次给大家带来vuejs项目打包后可能会出现的问题有哪些,vuejs项目打包的注意事项有哪些,下面就是实战案例,一起来看一下。 一:使用CDN资源 我们在打包时,会将package.json里,dependencies对象里插件打包起来,我…

    编程技术 2025年3月8日
    200
  • vue.js中created方法的使用详解

    这次给大家带来vue.js中created方法的使用详解,使用vue.js中created方法的注意事项有哪些,下面就是实战案例,一起来看一下。 这是它的一个生命周期钩子函数,就是一个vue实例被生成后调用这个函数。一个vue实例被生成后还…

    2025年3月8日 编程技术
    200

发表回复

登录后才能评论