首页 web前端 js教程 实例详解vue环境搭建简单教程

实例详解vue环境搭建简单教程

Dec 26, 2017 pm 01:44 PM
搭建 环境 简单

要使用vue来开发前端框架,首先要有环境,这个环境要借助于node,所以要先安装node,借助于node里面的npm来安装需要的依赖等等。本文主要介绍了vue环境搭建简单教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能帮助到大家。

①安装nodejs

https://nodejs.org

下载nodejs,(lts)安装的时候,点击同意,一路next就可以。

会自带一个npm(npm是个包管理器,有啥用?是个仓库,需要用到啥 直接npm install packageName就可以了)

测试:

②安装cnpm(淘宝镜像,)


npm install -g cnpm --registry=https://registry.npm.taobao.org
登录后复制

③安装vue-cli

windows电脑,同时按下widnows+r,输入cmd,点击回车,进入到命令行模式;

在命令行中输入以下指令,最后点击回车
(npm install vue-cli -g (cnpm在安装好淘宝镜像后和npm等同))cnpm install --global vue-cli

④安装webpack

npm install webpack -g

  

④根据vue-cli安装后提供的vue指令创建模板项目

  使用老师提供的模板压缩包(tpls.zip)

  tpls.zip我已经上传在在文件下“资料”里

放在D盘,新建vue_cli,将解压后的每个文件复制到vue_cli中。

⑤安装项目需要用到的依赖

将上述文件夹解压缩之后,进入到该目录中执行指令:


cnpm install
登录后复制

⑥执行指令,启动开发服务器


npm run dev
登录后复制

注意:如果淘宝镜像安装失败,解决办法:

先设置代理为空 npm config set proxy null,然后再次安装淘宝镜

相关推荐:

实例详解vue组件父子间通信之聊天室

实例详解vue 运用mock数据

vue中如何实现滚动加载更多的功能

以上是实例详解vue环境搭建简单教程的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您听不到任何人,如何修复音频
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解锁Myrise中的所有内容
4 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

最简便的硬盘序列号查询方式 最简便的硬盘序列号查询方式 Feb 26, 2024 pm 02:24 PM

硬盘序列号是硬盘的一个重要标识,通常用于唯一标识硬盘以及进行硬件识别。在某些情况下,我们可能需要查询硬盘序列号,比如在安装操作系统、查找正确设备驱动程序或进行硬盘维修等情况下。本文将介绍一些简单的方法,帮助大家查询硬盘序列号。方法一:使用Windows命令提示符打开命令提示符。在Windows系统中,按下Win+R键,输入"cmd"并按下回车键即可打开命

无法引导到Windows恢复环境 无法引导到Windows恢复环境 Feb 19, 2024 pm 11:12 PM

Windows恢复环境(WinRE)是用于修复Windows操作系统错误的环境。进入WinRE后,您可以执行系统还原、出厂重置、卸载更新等操作。如果无法引导到WinRE,本文将指导您使用修复程序解决此问题。无法引导到Windows恢复环境如果无法引导至Windows恢复环境,请使用下面提供的修复程序:检查Windows恢复环境的状态使用其他方法进入Windows恢复环境您是否意外删除了Windows恢复分区?执行Windows的就地升级或全新安装下面,我们已经详细解释了所有这些修复。1]检查Wi

Python和Anaconda之间有什么区别? Python和Anaconda之间有什么区别? Sep 06, 2023 pm 08:37 PM

在本文中,我们将了解Python和Anaconda之间的差异。Python是什么?Python是一种开源语言,非常重视使代码易于阅读并通过缩进行和提供空白来理解。Python的灵活性和易于使用使其非常适用于各种应用,包括但不限于对于科学计算、人工智能和数据科学,以及创造和发展的在线应用程序。当Python经过测试时,它会立即被翻译转化为机器语言,因为它是一种解释性语言。有些语言,比如C++,需要编译才能被理解。精通Python是一个重要的优势,因为它非常易于理解、开发,执行并读取。这使得Pyth

如何使用Java编写一个简单的学生成绩报表生成器? 如何使用Java编写一个简单的学生成绩报表生成器? Nov 03, 2023 pm 02:57 PM

如何使用Java编写一个简单的学生成绩报表生成器?学生成绩报表生成器是一个可以帮助老师或教育者快速生成学生成绩报告的工具。本文将介绍如何使用Java编写一个简单的学生成绩报表生成器。首先,我们需要定义学生对象和学生成绩对象。学生对象包含学生的姓名、学号等基本信息,而学生成绩对象则包含学生的科目成绩和平均成绩等信息。以下是一个简单的学生对象的定义:public

快速入门:使用Go语言函数实现简单的图书管理系统 快速入门:使用Go语言函数实现简单的图书管理系统 Jul 30, 2023 am 09:18 AM

快速入门:使用Go语言函数实现简单的图书管理系统引言:随着计算机科学领域的不断发展,软件应用的需求也越来越多样化。图书管理系统作为一种常见的管理工具,也成为很多图书馆、学校和企业必备的系统之一。在本文中,我们将使用Go语言函数来实现一个简单的图书管理系统。通过这个例子,读者可以学习到Go语言中函数的基本用法以及如何构建一个实用的程序。一、设计思路:我们首先来

如何通过PHP编写一个简单的在线预约系统 如何通过PHP编写一个简单的在线预约系统 Sep 26, 2023 pm 09:55 PM

如何通过PHP编写一个简单的在线预约系统随着互联网的普及和用户对便利性的追求,在线预约系统越来越受到欢迎。无论是餐厅、医院、美容院还是其他服务行业,都可以通过一个简单的在线预约系统来提高效率并为用户提供更好的服务体验。本文将介绍如何使用PHP编写一个简单的在线预约系统,并提供具体的代码示例。创建数据库和表格首先,我们需要创建一个数据库来存储预约信息。在MyS

Vue框架下,如何快速搭建统计图表系统 Vue框架下,如何快速搭建统计图表系统 Aug 21, 2023 pm 05:48 PM

Vue框架下,如何快速搭建统计图表系统在现代网页应用中,统计图表是必不可少的组成部分。Vue.js作为一款流行的前端框架,提供了很多便捷的工具和组件,能够帮助我们快速搭建统计图表系统。本文将介绍如何利用Vue框架以及一些插件来搭建一个简单的统计图表系统。首先,我们需要准备一个Vue.js的开发环境,包括安装Vue脚手架以及一些相关的插件。在命令行中执行以下命

如何通过C++编写一个简单的音乐推荐系统? 如何通过C++编写一个简单的音乐推荐系统? Nov 03, 2023 pm 06:45 PM

如何通过C++编写一个简单的音乐推荐系统?引言:音乐推荐系统是现代信息技术的一个研究热点,它可以根据用户的音乐偏好和行为习惯,向用户推荐符合其口味的歌曲。本文将介绍如何使用C++编写一个简单的音乐推荐系统。一、收集用户数据首先,我们需要收集用户的音乐偏好数据。可以通过在线调查、问卷调查等方式来获得用户对不同类型音乐的喜好程度。将数据保存在一个文本文件或数据库

See all articles