一文教会你如何运行vue项目

 更新时间:2022年06月06日 16:14:11   作者:。。。-  
最近因为公司项目问题,开始学习vue,这篇文章主要给大家介绍了关于如何运行vue项目的相关资料,文中还介绍了如何运行别人的项目,需要的朋友可以参考下

一、运行vue项目

1、下载node.js

安装完成后分别在cmd中执行node -v查看是否安装成功,出现版本号就安装成功了

2、安装 webpack

npm install webpack -g

安装完成后分别在cmd中执行npm -v查看是否安装成功,出现版本号就安装成功了

3、安装vue-cli脚手架

cnpm install vue-cli -g

安装完成后查看vue-cli脚手架 版本确定是否安装成功,出现版本号就安装成功了

vue -V

4、使用vue-cli创建项目

首先创建一个文件夹,cmd 进入到该项目里,输入以下命令

vue create hello-world

注:hello-word是文件夹名字可以改

5、运行项目

输入以下命令来运行项目

cd hello-world
npm run serve

出现以上页面,说明项目运行成功了。

二、运行别人的项目

1、删除package-lock.json文件

package-lock.json记录了整个node_moudles文件夹的树状结构,还记录了模块的下载地址,但是它是基于项目作者的npm版本库生成的,若不删掉这个依赖文件,容易出现npm版本差异导致的报错。

2、切换项目目录

然后打开cmd,cd到项目目录,具体操作:先输入该盘符,然后再用cd命令切换目录。

3、清除npm缓存

npm有缓存时,常常出现安装依赖不成功的现象,且一旦出现这个问题,报错信息很完善,但根据报错信息一项一项去解决,却死活解决不了,还找不出原因。

npm clean cache -f

4、重新安装依赖。

npm install

5、最后运行项目。

npm run serve

总结

到此这篇关于如何运行vue项目的文章就介绍到这了,更多相关vue项目运行内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 如何将HTML页面改写到vue项目中详解

    如何将HTML页面改写到vue项目中详解

    html和vue都是前端技术中非常重要的一部分,其中html是web开发的基石,而vue则是现代化的前端开发框架之一,下面这篇文章主要给大家介绍了关于如何将HTML页面改写到vue项目中的相关资料,需要的朋友可以参考下
    2024-08-08
  • vue中格式化时间过滤器代码实例

    vue中格式化时间过滤器代码实例

    这篇文章主要介绍了vue格式化时间过滤器,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • vue数据字典取键值方式

    vue数据字典取键值方式

    这篇文章主要介绍了vue数据字典取键值方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-04-04
  • vxe-table中vxe-grid(高级表格)的使用方法举例

    vxe-table中vxe-grid(高级表格)的使用方法举例

    vxe-table是一个基于vue的表格组件,下面这篇文章主要给大家介绍了关于vxe-table中vxe-grid(高级表格)的使用方法,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-05-05
  • axios向后台传递数组作为参数的方法

    axios向后台传递数组作为参数的方法

    今天小编就为大家分享一篇axios向后台传递数组作为参数的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • Vue watch响应数据实现方法解析

    Vue watch响应数据实现方法解析

    这篇文章主要介绍了Vue watch响应数据实现方法解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-07-07
  • 用Vue编写抽象组件的方法

    用Vue编写抽象组件的方法

    这篇文章主要介绍了用Vue编写抽象组件的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-05-05
  • Vue分页器实现原理详解

    Vue分页器实现原理详解

    这篇文章主要为大家详细介绍了Vue分页器实现原理,编写了分页器组件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-06-06
  • vue radio单选框,获取当前项(每一项)的value值操作

    vue radio单选框,获取当前项(每一项)的value值操作

    这篇文章主要介绍了vue radio单选框,获取当前项(每一项)的value值操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-09-09
  • vue使用jsonp抓取qq音乐数据的方法

    vue使用jsonp抓取qq音乐数据的方法

    这篇文章主要介绍了vue使用jsonp抓取qq音乐数据的方法,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-06-06

最新评论