当前位置: 首页 > 编程笔记 >

安装vue-cli的简易过程

桑飞语
2023-03-14
本文向大家介绍安装vue-cli的简易过程,包括了安装vue-cli的简易过程的使用技巧和注意事项,需要的朋友参考一下

安装vue-cli的前提是你已经安装了npm,安装npm你可以直接下载node的安装包进行安装。你可以在命令行工具里输入npm -v 检测你是否安装了npm和版本情况。出现版本号说明你已经安装了npm和node,如果该命令不可用,需要安装node软件包,根据你的系统版本选择下载安装就可以了。

一、安装vue-cli

在命令行工具输入:

npm install vue-cli -g 

-g:代表全局安装。用vue -V 来检查你安装版本号(-V,是大写的)

二、初始化项目

我们用vue init 命令来初始化项目:

vue init <template-name> <project-name> 

<template-name>:表示模板名称,vue-cli官方为我们提供了5种模板,

webpack,webpack-simple,browserify,browserify-simple,simple

<project-name>:标识项目名称,这个你可以根据自己的项目来起名字。在实际开发过程中,我们一般都会使用webpack这个模板。

vue init webpack vueclitest 

输入命令后,会询问我们几个简单的选项,我们根据自己的需要填写就可以了。

Project name:项目名称。注意:这里不能使用大写。

Project description:项目描述。

Author:作者,如果你有配置git的作者,它会读取。

Install vue-router? : 是否安装vue的路由插件。yes

Use ESLint to your code? :是否用ESLint来限制你的代码错误和风格。自己练习不用了。如果是大型团队开发,最好进行配置。

setup unit tests with Karma +Mocha?是否需要安装单元测试工具。我们不需要。N

Setup e2e tests with Nightwatch?是否安装e2e来进行用户行为模拟测试,我自己练习不需要。输入n

这样我们已经初始化好了第一步。

cd vueclitest 进入我们的vue项目目录。

npm install 安装我们的项目依赖,也就是安装package.json 里的包(也可以使用cnpm来安装)

npm run dev 开发模式下运行我们的程序。给我们自动构建了开发用的服务器坏境和在浏览器中打开,并实时监视我们的代码更改。

总结

以上所述是小编给大家介绍的安装vue-cli的简易过程,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对小牛知识库网站的支持!

 类似资料:
  • 1. 前言 本小节我们会介绍Vue脚手架工具 Vue-Cli 以及调试工具 VueDevTools 的安装和使用。 2. 什么是 Vue-Cli vue-cli是有 Vue 提供的一个官方 cli,专门为单页面应用快速搭建繁杂的脚手架。它是用于自动生成 vue.js+webpack 的项目模板。 2.1 安装 Cli // npm 安装 npm install -g @vue/cli //

  • 在/usr/lib/node_modules/angular-cli/node_modules/node-sass/vendor/linux-x64-51/binding中找到二进制文件。节点测试二进制总线错误(核心转储)/usr/lib──(空) npm WARN可选跳过可选依赖项:fsevents@^1.0.0(Node_modules/angular-cli/node_modules/cho

  • 本文向大家介绍详解使用nodeJs安装Vue-cli,包括了详解使用nodeJs安装Vue-cli的使用技巧和注意事项,需要的朋友参考一下 前提:nodeJs本地已安装。 1、执行npm install --global vue-cli ,全局安装vue-cli ----因为默认是从国外服务器下,可以使用阿里巴巴在国内的镜像服务器。 产生通过config命令设置默认下载路径: 然后再执行: 2、安

  • 本文向大家介绍详解vue-cli 脚手架 安装,包括了详解vue-cli 脚手架 安装的使用技巧和注意事项,需要的朋友参考一下 一、 node安装 1)如果不确定自己是否安装了node,可以在命令行工具内执行: node -v (检查一下 版本); 2)如果 执行结果显示: xx 不是内部命令,说明你还没有安装node , node 安装地址:http://nodejs.cn/download/

  • 本文向大家介绍vue-cli安装使用流程步骤详解,包括了vue-cli安装使用流程步骤详解的使用技巧和注意事项,需要的朋友参考一下 1.全局安装vue-cli cnpm i vue-cli -g 2.监测安装版本 vue -V 大写V : version 3.指定目录下新建项目 vue init webpack [项目名] 按自己的意愿配置、选择对应信息。最后配置完成检查package.json是

  • 1. 前言 本小节将带领大家学习一下如何安装 Vue。包括独立版本、CDN、NPM、CLI 工具四种不同的安装方法。 2. 独立版本 我们可以在 Vue.js 的官网上直接下载 vue.min.js 并用<script>标签引入。 下载Vue.js 安装步骤: 打开Vue.js下载地址并拷贝所有代码。 创建vue.min.js文件,并将拷贝的源码粘贴进去。 创建index.html并通过<scri