快速构建一个vue项目
首先介绍一下命令行构建一个vue项目步骤:
1、下载安装node.js(直接运行安装包根据步骤安装完),打开命令行输入:node -v ,出现版本号即安装成功。
2、命令行界面输入:cnpm install vue-cli -g,全局安装vue.cli脚手架,输入vue list 出现如下信息即可。

3、选择一个目录创建项目文件夹,cd命令到该文件夹,输入命令:vue init webpack ”项目名称“,根据提示填写对应信息和设置安装事项。

4、项目创建完成后,会出现两个命令,依次输入执行就可以运行项目,使用浏览器打开最后出现的提示地址就可以看到vue项目的初始化界面。



5、如此:vue项目创建完毕,接下来就可以在各种开发工具中导入vue项目进行下一步开发了。
初学者快速构建一个vue项目:
下载安装HBuilder X 工具:http://www.dcloud.io/hbuilderx.html
左上角文件→新建→项目,在项目面板中选择vue项目


项目结构如下:

运行项目:确保该项目的必须包都已下载好,没有的话先执行npm install。执行操作同下,两种皆可。
菜单运行方式:运行→运行到终端→npm run serve,出现运行地址后到浏览器运行即可。 命令方式:右键vue项目→使用命令行窗口打开所在目录(A)→输入命令:npm run serve→回车执行,得到一样的运行结果



快速构建一个vue项目的更多相关文章
- 利用 vue-cli 构建一个 Vue 项目
一.项目初始构建 现在如果要构建一个 Vue 的项目,最方便的方式,莫过于使用官方的 vue-cli . 首先,咱们先来全局安装 vue-cli ,打开命令行工具,输入以下命令: $ npm inst ...
- springboot:快速构建一个springboot项目
前言: springboot作为springcloud的基础,springboot的热度一直很高,所以就有了这个springboot系列,花些时间来了解和学习为自己做技术储备,以备不时之需[手动滑稽] ...
- 构建一个Vue项目
一 我们需要安装vue.js Vue.js官网 当我们已经安装了vue-cli,那么我们需要更新Vue-cli. vue-cli3.0使用及配置 二 安装好了之后: 我们可以直接使用命令:mkdir ...
- 不借助vue-cli,自行构建一个vue项目
前言: 对于刚刚接触vue的同学来说,直接用官方的构建工具vue-cli来生成一个项目结构会存在一些疑惑,比如: .vue组件 为什么可以写成三段式(tempalte.script.style)? ...
- [开源]快速构建一个WebApi项目
项目代码:MasterChief.DotNet.ProjectTemplate.WebApi 示例代码:https://github.com/YanZhiwei/MasterChief.Project ...
- 快速构建一个springboot项目(一)
前言: springcloud是新一代的微服务框架而springboot作为springcloud的基础,很有必要对springboot深入学习一下. springboot能做什么? (1)spri ...
- 快速创建一个vue项目
vue脚手架 用来创建vue项目的工具包 创建项目: npm install -g vue-cli vue init webpack VueDemo 开发环境运行: cd VueDemo npm in ...
- 【springBoot】之快速构建一个web项目
基于maven,首先看pom文件 <parent> <groupId>org.springframework.boot</groupId> <artifact ...
- 快速构建一个简单的单页vue应用
技术栈 vue-cli webpack vux,vux-loader less,less-loader vue-jsonp vue-scroller ES6 vue-cli:一个vue脚手架工具,利用 ...
随机推荐
- Android Support v4\v7\v13和AndroidX理解【转载】
为什么要用support库呢? 因为在低版本Android平台上开发一个APP时,想使用高版本才有的功能,此时就需要使用Support来支持兼容. 1. android-support-v4 comp ...
- Python_迭代器与生成器
迭代器 迭代是Python最强大的功能之一,是访问集合元素的一种方式.. 迭代器是一个可以记住遍历的位置的对象. 迭代器对象从集合的第一个元素开始访问,直到所有的元素被访问完结束.迭代器只能往前不会后 ...
- Linux提权(持续更新)
利用/etc/passwd提权 个人认为,这种提权方式在现实场景中难以实现,条件太过苛刻,但是建立Linux下的隐藏账户是个不错的选择,灵感来自:https://www.hackingarticles ...
- python-网络安全编程第十天(web目录扫描&&fake_useragent模块&&optionParser模块)
前言 昨天的内容没有完成今天花了点时间继续完成了 感觉自己的学习效率太低了!想办法提高学习效率吧 嗯 ,再制定下今天的目标 开始健身. python fake_useragent模块 1.UserAg ...
- CTF-lottery[git文件泄露利用+PHP弱类型]
知识点:PHP弱类型 .git文件泄露 玩攻防世界 遇到一个题lottery 进去看看 分析玩法 我们发现 进入登陆用户都是初始值 金钱是20 彩票号码必须输入7位 然后看你输入的彩票号码有多少 ...
- 云服务器-Ubuntu更新系统版本-更新Linux内核-服务器安全配置优化-防反弹shell
购入了一台阿里云的ESC服务器,以前都用CentOS感觉Yum不怎么方便,这次选的Ubuntu16.04.7 搭好服务之后做安全检查,发现Ubuntu16.04版本漏洞众多:虽然也没有涉及到16.04 ...
- TestLink在线Excel用例转换xml
[原文链接]:https://blog.tecchen.tech ,博文同步发布到博客园. 由于精力有限,对文章的更新可能不能及时同步,请点击上面的原文链接访问最新内容. 欢迎访问我的个人网站:htt ...
- 在IDM上设置防止过度抓取网站信息
在使用Internet Download Manager(IDM)下载器时,有时会发现IDM自带的抓取功能过于强大,以至于有时会抓取一些无效的链接.那么,该如何避免IDM的过度抓取呢? 图1:IDM的 ...
- QQ账号测试用例
- linux(cemtos7.x)安装docker
卸载旧版本 yum remove docker docker-client docker-client-latest docker-common docker-latest docker-latest ...