原文:

  简书原文:https://www.jianshu.com/p/1af9b72cf86e

大纲

  1、安装NodeJs
  2、安装vue-cli
  3、创建项目
  4、启动项目
  5、打包项目
  6、项目实例

1、安装NodeJs

  NodeJs安装好之后会连带着安装一个npm,nodeJs的安装流程很简单,按着步骤一步一步下来即可。
  安装完成之后在控制台上输入npm -v 以及 node -v若成功则会输出对应版本,并且已经将npm和node部署到了全局的环境变量。

2、安装vue-cli

  安装完成之后,可以通过vue list来查看可以使用哪些模板

npm install -g vue-cli

3、创建项目

  完成项目的一系列配置

vue init webpack <your project>

4、启动项目

npm run dev

  启动之后的提示端口8080中打开了应用

5、打包项目

npm run build

6、项目实例

  vue项目实例中的vue-base中就是我自己搭建的vue的初始项目。

参考网址

  https://segmentfault.com/a/1190000010659925

使用vue-cil搭建项目的更多相关文章

  1. 1.vue脚手架搭建项目

    前言: 在使用Vue-cli脚手架搭建项目之前,需要安装node.js和npm以及vue-cli. 开始搭建项目: 1.打开cmd win+R 2.转到要搭建的项目路径: g: cd Webapp/v ...

  2. Vue环境搭建-项目的创建-启动生命周期-组件的封装及应用

    vue项目环境的搭建 """ node >>> python:node是用c++编写用来运行js代码的 npm(cnpm) >>> p ...

  3. Vue脚手架搭建项目

    全局安装vue脚手架 $ npm install -g vue-cli 卸载方法 $ npm uninstall -g vue-cli 查看vue版本(注意:大写的V) $ vue -V 创建项目 $ ...

  4. 使用vue脚手架搭建项目并将px自动转化为rem

    一.安装node.js环境 二.node.js安装完成后使用npm安装vue脚手架vue-cli和安装webpack,我这里用cnpm cnpm i @vue/cli -g //全局安装脚手架3.0 ...

  5. vue cli搭建项目及文件引入

    cli搭建方法:需安装nodejs先 1.npm install -g cnpm --registry=https://registry.npm.taobao.org //安装cnpm,用cnpm下载 ...

  6. nodejs使用vue从搭建项目到发布部署

    都说是使用vue 脚手架自然用的是vue-cli npm install vue-cli -g 建立项目 vue init webpack demo //vue初始化 使用webpack 项目名称 这 ...

  7. 【vue】vue +element 搭建项目,mock模拟数据(纯干货)

    1.安装mockjs依赖 (c)npm install mockjs --save-dev 2.安装axios(Ajax) (c)npm install --save axios 3.项目目录 4.设 ...

  8. 使用VUE框架搭建项目基本步骤

    ps:初入Vue坑的小伙伴们,对于独立做一个项目可能不清楚需要使用哪些资源,这篇随笔希望对大家有所帮助. 第一步:参照vue的官方文档,建立一个vue的项目 # 全局安装 vue-cli $ npm ...

  9. vue+webpack搭建项目

    1.全局安装node.js 2.安装vue-cli 可以在项目目录安装 npm install -g vue-cli 使用vue-list命令选择webpack模板 vue init webpack ...

  10. VUE神速搭建项目

    1.npm install -g vue-cli 全局安装vue-cli脚手架 2.vue init webpack vueTest 初始化一个基于webpack的项目 3.cd vueTest 进入 ...

随机推荐

  1. [ Java ] [ Spring ] Spring 一些配置项 及 <context:annotation-config/> 專文解释说明

    節錄重點: @ Resource .@ PostConstruct.@ PreDestro.@PersistenceContext.@Required 都必須聲明相關的 bean 所以如果總是需要按照 ...

  2. 【DRF分页】

    目录 第一种 PageNumberPagination 查第n页,每页显示n条数据 第二种 LimitOffsetPagination 在第n个位置,向后查n条数据 第三种 CursorPaginat ...

  3. userdel---删除用户及相关文件

    userdel命令   userdel命令用于删除给定的用户,以及与用户相关的文件.若不加选项,则仅删除用户帐号,而不删除相关文件. 语法 userdel(选项)(参数) 选项 -f:强制删除用户,即 ...

  4. 一起talk C栗子吧(第三十四回:C语言实例--巧用溢出计算最值)

    各位看官们.大家好,上一回中咱们说的是巧用移位的样例,这一回咱们说的样例是:巧用溢出计算最值. 闲话休提,言归正转.让我们一起talk C栗子吧! 大家都知道,程序中的变量都有一个取值范围,这个范围也 ...

  5. 【agc014d】Black and White Tree

    又是被虐的一天呢~(AC是不可能的,这辈子不可能AC的.做题又不会做,就是打打暴力,才能维持骗骗分这样子.在机房里的感觉比回家的感觉好多了!里面个个都是大佬,个个都是死宅,我超喜欢在里面的!) (↑以 ...

  6. 3/18 Django框架 启动django服务

    web框架:本质是socket服务端,socket通常也被称为"套接字",用于描述IP地址和端口,是一个通信链的句柄,可以用来实现不同虚拟机或不同计算机之间的通信.web框架就是将 ...

  7. 又一次认识java(一) ---- 万物皆对象

    假设你现实中没有对象.至少你在java世界里会有茫茫多的对象,听起来是不是非常激动呢? 对象,引用,类与现实世界 现实世界里有许很多多的生物,非生物,跑的跳的飞的,过去的如今的未来的,令人眼花缭乱.我 ...

  8. xcode6.3 模版位置

    /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/Developer/Library/Xcode/Templ ...

  9. 1.Dubbo教程

    转自:https://blog.csdn.net/hellozpc/article/details/78575773 2. 什么是dubbo 2.1. 简介 DUBBO是一个分布式服务框架,致力于提供 ...

  10. 3. Spring Boot Servlet

    转自:https://blog.csdn.net/catoop/article/details/50501686