vue.js文档:https://cn.vuejs.org/v2/guide/

参考这个或者参考菜鸟教程也可以,不过还是那句话官网权威。

我这个主要是看相关的学习视频搭建的。

一、环境准备

环境准备(node.js环境):

脚手架环境:vue-cli

执行如下命令安装:

npm install vue-cli -g 或者cnpm install vue-cli -g

安装成功后在在命令行里输入vue,出现如图表示OK

二、项目初始化

vue init webpack project-name

例如:

vue init webpack blog

出现下面示意图:

Project name 可以自定义项目名

Project description 项目描述

Author 作者相关信息

VCue build 通常有三种 我选择标准的也就是第一种

Install vue-router 是否安装vue-router vue-router是vue的通信方式 我选择安装

EsLint 是否选择EsLint语法检查 我选择是

Set up unit tests 我不构建单元测试 所以选择否

其它的还有,这里就不再赘述。

初始化项目成功后,会出现如下所示:

三、运行项目

cd blog

npm run dev

出现如图,表示成功

在浏览器输入:http//localhost:8080,出现如图:

Vue.js项目脚手架构建的更多相关文章

  1. vue.js项目构建

    这里构建的vue.js项目依赖node服务器运行. 项目搭建完整步骤: 安装node.js ,转至nodeJs网站http://nodejs.cn/ 下载nodeJs进行安装. 安装完毕检查nodeJ ...

  2. Vuejs实例-01使用vue-cli脚手架搭建Vue.js项目

    [TOC] 1. 前言 vue-cli 一个简单的构建Vue.js项目的命令行界面 整体过程: $ npm install -g vue-cli $ vue init webpack vue-admi ...

  3. vue-cli脚手架搭建Vue.js项目

    前提条件: 一.node.js 下载 https://nodejs.org/zh-cn/download/ 二.webpack 安装 npm install webpack -g   PS:-g 就是 ...

  4. Vue.js项目的开发环境搭建与运行

    写作背景:手上入一个用Vue框架写的微信公众号项目,根据公司安排,我负责项目源代码的验收工作(当然专业的工作检测会交给web开发人员,我只是想运行起来看一看). 1 开发环境安装步骤: (一)安装no ...

  5. vue.js项目安装

    Vue.js 安装 NPM 方法安装vue.js项目 npm 版本需要大于 3.0,如果低于此版本需要升级它: # 查看版本 $ npm -v 2.3.0 #升级 npm npm install np ...

  6. vscode下面开发vue.js项目

    vscode下面开发vue.js项目   https://blog.csdn.net/linzhiqiang0316/article/details/79176651 vscode下面开发vue.js ...

  7. vue源码分析—Vue.js 源码构建

    Vue.js 源码是基于 Rollup 构建的,它的构建相关配置都在 scripts 目录下.(Rollup 中文网和英文网) 构建脚本 通常一个基于 NPM 托管的项目都会有一个 package.j ...

  8. 从零开始搭建一个vue.js的脚手架

    在谷歌工作的时候,我们要做很多界面的原型,要求快速上手,灵活运用,当时用的一些现有框架,比如angular,太笨重了——尤雨溪(Vue.js 作者) vue.js是现在一个很火的前端框架,官网描述其简 ...

  9. 建立多页面vue.js项目

    介绍 根据需求,我们希望建立一个多页面的vue.js项目,如何改造单页面vue.js项目为多页面项目?跟着我的步伐看下去吧. 1.创建单页面vue.js项目 简单的记录一下创建步骤: --安装cnpm ...

随机推荐

  1. quartz部署出现找不到表的情况,错误提示: Table 'heart_beat.QRTZ_LOCKS' doesn't exist

    描述一下,本地可以,部署到Linux就不行,Linux上的数据库是本地直接拷贝上去的,项目环境是Spring Boot2.1.Shiro.MyBatis.Redis.swagger.Bootstrap ...

  2. PATH、CLASSPATH、CLASSPATH

    PATH: 说明: 环境变量中的path,意在在向计算机发出指令时的一个指向路径,如 一般会在path里加上:%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin 其中:%JAVA_ ...

  3. ES 5 中 判断数组的方法

    源代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF- ...

  4. 洛谷P2447 [SDOI2010]外星千足虫(异或方程组)

    题意 题目链接 Sol 异或高斯消元的板子题. bitset优化一下,复杂度\(O(\frac{nm}{32})\) 找最优解可以考虑高斯消元的过程,因为异或的特殊性质,每次向下找的时候找到第一个1然 ...

  5. 教你读懂vue源码技术教程

    由于 Vue 的源码采用 ES6,所以你至少应该掌握 ES6 才能看得懂,其次你最好对 package.json 中的字段的作用有所了解.由于 Vue 使用 Rollup 构建,所以你不了解 Roll ...

  6. 如何将web项目部署到Ubuntu服务器上

    情景回顾: 前几天在下本着人道主义原则帮我老师的一个朋友做了个小网页,(啥人道不人道的,主要是给钱了),做完之后本来是想偷懒直接把网页扔给他自己部署去吧,结果让我帮忙部署一下,得,偷懒也偷不成了,搞吧 ...

  7. Windows下判断jdk是否安装好以及环境变量是否配置好

    cmd下执行: 1.java 2.javac 3.where java 如果三个都没问题,说明安装成功&环境变量配置成功

  8. AWT初步—Frame和 Panel

    初识 AWT       GUI 和 AWT GUI:Graphics User Interface  图形用户界面 AWT:Abstract Window Toolkit  抽象窗口工具集 之前的程 ...

  9. 利用火车头采集A67手机电影教程一

    今天将讲述:利用火车头采集A67手机电影,并导入到网站中,如果你要更多更快的教程,请访问:http://www.it28.cn/category-191.html 现在以A67中的电影中的动作片为例: ...

  10. JMeter 逻辑控制之While循环控制器(While Controller)

    逻辑控制之While循环控制器(While Controller)   by:授客 QQ:1033553122 测试环境 apache-jmeter-2.13 1.   添加While Control ...