vue-cli构建一个工程
使用前,必须要先按照 node:安装node
Vue CLI官方文档:https://cli.vuejs.org/zh/
安装node地址:https://nodejs.org/zh-cn/download/

安装后node文件如下:

需要配置环境变量

然后,就可以使用 npm 命令安装了:
打开cdm命令行输入以下命令
npm install -g @vue/cli



检测是否真的安装成功。打开cmd命令,查看一下node和自带的npm的版本信息

然后,就可以使用 vue 命令创建、管理项目了:
# 先切换到相应目录
e:
cd myhomework # 然后创建项目
vue create vue-hello-world # 创建完后,切换到项目目录
cd vue-hello-world # 接下来,启动项目服务器
# 服务器启动后,就可以使用 http://localhost:8080 访问到首页了
npm run serve # 然后就可以进行开发了
# - public 下面放一些全局静态文件
# - src 下面存在 main.js 跟相关 .vue 文件
# -- main.js 是入口 js 文件 # 开发完成后,就可以将工程打包、分发,运行在客户端了
# 执行完命令,打包的内容会在 dist 文件夹中
npm run build ## 另外,也可以使用图形化界面的形式进行(不推荐)
vue ui
效果展示:
vue-cli构建一个工程的更多相关文章
- Vue+webpack构建一个项目
		
1.安装CLI命令的工具 推荐用淘宝的镜像 npm install -g @vue/cli @vue/cli-init 2.使用命令构建一个名为myapp的项目 vue init webpack m ...
 - 使用vue/cli 创建一个简单的项目
		
首先,电脑安装了node.js官方要求8.9 或更高版本 (推荐 8.11.0+) npm install -g @vue/cli # OR yarn global add @vue/cli 全局安装 ...
 - VUE学习笔记之vue cli 构建项目
		
一.环境搭建: 1.安装node.js 从node.js官网下载并安装node,安装过程很简单,一路"下一步"就可以了.安装完成之后,打开命令行工具(win+r,然后输入cmd), ...
 - @vue/cli 构建得项目eslint配置
		
如下:package.json // package.json { "name": "ecommerce-mall-front", "version& ...
 - vue cli 构建的 webpack 项目设置多页面
		
1. webpack-dev-server下的设置(npm run dev) ./build/webpack.dev.conf.js 中,修改 new HtmlWebpackPlugin ,一个页面一 ...
 - 使用Vue CLI构建Vue项目
		
第一步:首先在控制台输入vue --version,如果出现版本号则进入第三步:否则进入第二步: 第二步:输入npm install cnpm -g --registry=https://regist ...
 - @vue/cli 构建得项目eslint配置2
		
使用ESLint+Prettier来统一前端代码风格 加分号还是不加分号?tab还是空格?你还在为代码风格与同事争论得面红耳赤吗? 正文之前,先看个段子放松一下: 去死吧!你这个异教徒! 想起自己刚入 ...
 - [Vue 牛刀小试]:第十七章 - 优化 Vue CLI 3 构建的前端项目模板(1)- 基础项目模板介绍
		
一.前言 在上一章中,我们开始通过 Vue CLI 去搭建属于自己的前端 Vue 项目模板,就像我们 .NET 程序员在使用 asp.net core 时一样,我们更多的会在框架基础上按照自己的开发习 ...
 - 【Vue CLI】从安装到构建项目再到目录结构的说明
		
目录 1. 构建我们的项目 2. 目录结构说明 2.1 build目录 2.2 config目录 2.3 src目录 2.4 static目录 "Vue CLI是一个基于Vue.js进行快速 ...
 
随机推荐
- 多进程-Pipe和Manager数据共享和传递
			
pipe.py#多进程数据传递接收和发送(类似socket) from multiprocessing import Process,Pipe def f(conn): conn.send([42,N ...
 - C# 如何判断指定文件是否正被其它程序使用
			
C# 如何判断指定文件是否正被其它程序使用 起因:项目中发现在操作文件时,系统经常抛出异常,表示文件正被其它程序占用. 需求:为了事先判断,以确认指定的文件是否正被其它程序使用,需要方法进行判断. 思 ...
 - cookie和session的详解和区别
			
会话(Session)跟踪是Web程序中常用的技术,用来跟踪用户的整个会话.常用的会话跟踪技术是Cookie与Session.Cookie通过在客户端记录信息确定用户身份,Session通过在服务器端 ...
 - React源码深度解析视频 某课网(完整版)
			
<ignore_js_op> [课程介绍]: React毫无疑问是前端界主流的框架,而框架本身就是热点.课程以讲解React实现原理为主,并在实现过程中讲解这么做的原因,带来 ...
 - 如何使用sqlalchemy获取表的主键、以及每一个字段名和对应类型
			
使用sqlalchemy获取到的结果只包含数据,不包含字段,那么我们如何获取到对应字段和其属性呢?以及如何获取某张表的主键呢? # -*- coding:utf-8 -*- # @Author: Wa ...
 - 2019.9.20使用kali中的metasploi获取windows 的权限
			
1 kali 基于debin的数字取证系统,上面集成了很多渗透测试工具,其前身是bt5r3(bractrack) 其中Metasploit是一个综合利用工具,极大提高攻击者渗透效率,使用ruby开发的 ...
 - web规范文档说明三
			
网站头部: head/header(头部) top(顶部)导航: nanv 导航具体区分:topnav(顶部导航).mainnav(主导航).mininav(迷你导航).textnav(导航 ...
 - xss过滤方法
			
用的白名单过滤,是我们的论坛自用的方法,也许考虑不周,欢迎来黑我们的论坛!https://www.ebcms.com/forum.html // 安全过滤 function safe_html($ht ...
 - Java 基础知识点滴(1)
			
1. ==与equals的区别 ==是用来判断两个变量的值是否相等.要比较两个基本变量或引用变量是否相等,只能用==: equal用来判断两个独立对象里面的内容是否一样. 例子: String s1 ...
 - VScode  VUE+PYTHON习惯用的编辑器
			
本人从事运维开发工作,经常要开发一些web系统工具,这就需要用到前后端开发.vscode是我用得最舒服的一种编辑器,前端后端都习惯在上面写,这里记录一些配置. 一,插件安装 目前我最主要用的是: ...
 
			
		
