精华内容
下载资源
问答
  • 关于npm安装vue-cli错误问题 问题描述 npm ERR! { Error: EPERM: operation not permitted, unlink ‘C:\Users\GXP300\AppData\Roaming\npm\node_modules.staging\typescript-886383bb\lib\tsserverlibrary.js’ ...
  • vue-cli-plugin-bootstrap-vue 适用于Bootstrap-Vue插件 安装 如果尚未安装vue-cli,请先按照此处的安装说明进行操作: : 使用vue-cli生成项目 vue create my-app 在安装bootstrap-vue插件之前,请确保提交或隐藏...
  • 安装多版本Vue-CLI,即在电脑上同时安装多个版本的Vue-CLI。那么为什么要安装多个版本呢?原因是Vue-cli3.0版本与之前的版本有了较大不同,当你要处理3.0之前的项目,又想使用之后的版本处理新的项目的时候就会遇到多...
  • vue-cli-plugin-chrome-extension-cli English || 使用Vue-CLI轻松启动chrome扩展项目! 支持vue2 vue3 TypeScript和JavaScript! 安装 该插件用于将新项目用于chrome扩展。 在Vue的默认项目上测试,使用...
  • vue-cli-plugin-element可以在几秒钟内使用vue-cli和element-ui快速构建企业应用程序。 该项目不仅是vue-cli插件,而且是vue-cli-plugin-element,可在几秒钟内使用vue-cli和element-ui快速构建企业应用程序。 该...
  • vue-cli2.0版本下载命令为npm install vue-cli或者npm install vue-cli@版本号,这里我指定了版本号,还有这里不要加-g,否则就会安装到全局位置 检验 下载完毕,会生成一个`node_modules`文件夹,进入该文件夹下的`....
  • vue启动一个项目的时候,需要执行npm run serve,其中这个serve的内容就是vue-cli-service serve。可见,项目的启动关键是这个vue-cli-service与它的参数serve。接下来我们一起看看service中主要写了什么东东(主要...
  • homebrew-vue-cli:使用Homebrew安装Vue CLI
  • 首先,安装vue-cli3。 npm install -g @vue/cli 安装好之后的项目是这样的,见下图: 相比较vue-cli2的项目,缺少了build和config目录,另外static目录也没了,多了个public目录。 配置文件需要自己写一个vue....
  • 安装 vue-cli3 环境准备 1. 如果您已安装 vue-cli2 ,请先删除当前脚手架,否则无法成功安装 vue-cli3 。 npm uninstall vue-cli -g 2. 检查 node.js 版本。 vue-cli3 需要 node 版本大于8.9。在cmd中输入 node -v ...
  • 主要介绍了全局安装 Vue cli3 和 继续使用 Vue-cli2.x操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 然后,通过运行以下命令安装并调用vue-cli-plugin-electron-builder的生成器:vue add electronic-builder就是这样! 您准备好出发了! 要启动开发服务器,请执行以下操作:如果您使用Yarn(强烈建议使用):yarn ...
  • vue-cli-plugin-tauri 是用于通过Web前端创建更小,更快,更安全的桌面应用程序的工具包。 该插件将Tauri配置为可在您的Vue CLI项目中使用。 安装 如果您有任何问题,请访问或我们的。 一般先决条件: NodeJS / ...
  • 全局安装vue-cli npm install -g vue-cli 当然了,要想使用npm工具,就必须安装Node.js,node.js的安装方法这里就不做介绍了。 安装完成后,在终端输入以下命令, 可以查看vue的版本:vue -V 输入以下命令,可以...
  • Win10安装Vue-cli

    2020-07-16 23:18:40
    文章目录Win10安装Vue-cli前言详细流程安装webpack安装vue-cli构建简单的vue项目参考文章 前言 vue-cli 是一个官方发布 vue.js 项目脚手架,GitHub地址是:https://github.com/vuejs/vue-cli 我们平时所说的 vue ...

    Win10安装Vue-cli

    前言

    vue-cli 是一个官方发布 vue.js 项目脚手架,GitHub地址是:https://github.com/vuejs/vue-cli

    我们平时所说的 vue 脚手架指的是 vue-cli,它是一个专门为单页面应用快速搭建繁杂的脚手架,它可以轻松的创建新的应用程序而且可用于自动生成 vue 和 webpack 的项目模板。

    vue-cli 这个构建工具大大降低了webpack的使用难度,支持热更新,有webpack-dev-server的支持,相当于启动了一个请求服务器,给你搭建了一个测试环境,只关注开发就OK。

    Vue-cli 运行需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。我们需要提前安装好 Node.js,没有装的请参考这篇博客 Win10安装NodeJS

    如果安装的是旧版本的 npm,我们可以通过 npm 命令来进行版本升级

    npm install npm -g
    

    详细流程

    安装webpack

    我们使用 npm 来全局安装 webpack。

    命令中的“-g”其实是“–global”的缩写,意思是全局安装。

    需要注意的是,从 webpack 4.X 版本开始,就需要安装 webpack-cli 依赖了。所以这里我们把 webpack-cli 依赖一起装上。

    打开cmd,输入

    npm install -g webpack
    npm install -g webpack webpack-cli
    

    n1
    n2

    安装完成后,我们查看 webpack 版本

    webpack -v
    

    n3

    安装vue-cli

    我们同样使用 npm 全局安装 vue-cli。

    需要注意的是,新版本 Vue CLI 的包名称由 vue-cli 改成了 @vue/cli

    如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x),你需要先通过 npm uninstall -g vue-cli 卸载它。(当然旧版本的 vue-cli 依旧是可以使用的)

    旧名称下 vue-cli 的安装

    npm install -g vue-cli
    

    新名称下的 vue-cli 的安装(推荐使用)

    npm install -g @vue/cli
    npm install -g @vue/cli-init
    

    n4
    n5

    我们用这个命令来检查其版本是否正确

    vue --version
    

    n6

    可以看到,我们安装的是新版本。到这一步,vue-cli 就安装完毕了,可以开始使用了。

    构建简单的vue项目

    我们已经安装好了 vue-cli,下面我们使用 vue-cli 来构建一个简单的项目。

    首先,我们在命令行中把当前目录定位到你准备存放项目的地方。(注意,提前在磁盘中建立这个目录)

    比如现在我准备把项目放在 D:\vue 这个目录下面,那么先通过cmd命令进入这个目录。
    n7

    接着,我们使用 webpack 组件搭建一个简易的项目

    vue init webpack xxx
    

    其中的 xxx 是项目的名字,自行命名即可。这里我们命名为 demo

    注意,这里的项目名不能有大写字母,否则会报错

    项目正常构建时会弹出几个选项进行回答:

    选项含义
    Project name这是项目名称,直接回车就会取括号中的默认名字;否则直接输入新的项目名
    Project description这是项目描述,直接回车使用默认描述
    Author (xxxxxx)这是作者的名字,可以直接回车,也可以在后面直接输入你的作者名
    Vue build主键建立,有两种方式提供选择。
    1. Runtime + Compiler 运行加编译,推荐使用。
    2. Runtime-only 仅运行, 速度更快。
    这两种方式可以通过键盘的上下箭头进行选择,确认后按回车即可(推荐使用第一种,运行加编译,选中之后结果为 standalone
    Install vue-router是否安装vue-router。这是官方的路由,大多数情况下都使用,建议输入Y 安装
    Use ESLint to lint your code是否使用ESLint管理代码。ESLint是个代码风格管理工具,是用来统一代码风格的,一般项目中都会使用。建议输入 Y
    Pick an ESLint preset选择一个ESLint预设,这里有三个选项,默认为 standard 即可,直接回车
    Set up unit tests是否安装单元测试,项目一般都会安装单元测试,建议输入 Y
    Pick a test runner同样地,选择一个单元测试工具,默认 Jest 即可,直接回车
    Setup e2e tests with Nightwatch是否安装e2e测试,同理,输入Y ,并选择第一个
    Should we run npm install for you after the project has been created选择构建项目的方式:npm、yarn或者手动构造,默认使用 npm,直接回车即可

    n8

    总结一下就是,如果项目没有什么需要修改的地方,一路回车即可

    稍微等待几分钟,等待项目构建完成。出现 finish 字样则项目构建完毕。

    n9

    进入刚建立的项目中,开始运行

    cd demo
    npm run dev
    

    耐心等待加载,加载完成后命令行中会弹出一个网址

    n10

    我们直接在浏览器输入该网址,就可以看到一个简单的 vue 项目了。

    n11

    如果要停止项目运行,关闭命令行即可。

    下次我们在命令行进入 demo 项目的目录后,可以直接启动项目。

    要删除这个 vue 项目也十分地简单,直接到磁盘中删除项目即可。比如我们项目在 D:\vue 目录,直接进入此目录删除 demo 项目就行了。

    参考文章

    vue-cli(vue脚手架)超详细教程

    Windows10下配置Vue环境

    windows环境安装vue-cli及webpack并创建vueJs项目

    展开全文
  • vue-cli-plugin-vuetify-preset-basil 罗勒材料研究 vue-cli-plugin-vuetify-preset-crane 起重机材料研究 vue-cli-plugin-vuetify预置-每两周一次 每两周进行一次材料研究 vue-cli-plugin-vuetify预设猫头鹰 ...
  • 安装yarn后安装vue-cli

    千次阅读 2020-11-24 10:53:45
    1.安装yarn后安装vue-cli 步骤 yarn依赖node.js 所以安装前确认node已安装并生效 node -v验证是否生效 进yarn官网:https://yarnpkg.com/zh-Hant/ 直接选win下msi稳定版安装包 下载安装 安装后 yran -v 验证安装是否...

    1.安装yarn后安装vue-cli 步骤

    yarn依赖node.js 所以安装前确认node已安装并生效 node -v验证是否生效
    进yarn官网:https://yarnpkg.com/zh-Hant/
    直接选win下msi稳定版安装包 下载安装

    在这里插入图片描述

    安装后 yran -v 验证安装是否生效 新版的yran不用配置path直接生效

    安装vue-cli

    yarn global add vue-cli     
    

    在这里插入图片描述

    验证vue是否下载到本地

    yarn global list
    

    在这里插入图片描述

    最后直接vue -V验证

    在这里插入图片描述

    最后cd进入项目文件夹 vue init webpack 项目名 开始新建项目即可

    展开全文
  • vue-cliVue 提供的一个官方命令行工具,可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置,带来现代化的前端开发流程。只需几分钟即可创建并...# 必须全局安装vue-cli,否则无法使用vue命令 # 安装
  • 如何安装vue-cli 3.x以及怎么使用vue-cli3.x创建项目 安装vue-cli3.x步骤 安装vue-cli3.x版本前,先查看下你的电脑是否安装vue-cli或是安装vue-cli2.x版本 vue --version / vue -V 如果有vue-cli2.x版本...

    如何安装vue-cli 3.x以及怎么使用vue-cli3.x创建项目

    安装vue-cli3.x步骤

    安装vue-cli3.x版本前,先查看下你的电脑是否安装过vue-cli或是安装过vue-cli2.x版本

    •   	vue --version / vue -V
      

    如果有vue-cli2.x版本,需要先卸载才能安装vue-cli3.x,卸载完成后就可以安装vue-cli3.x版本咯

    •   	npm uninstall vue-cli -g
      

    安装vue-cli3.x版本

    •   	npm install -g @vue/cli 
      

    查看下是否安装成功

    •   	vue --version / vue -V 
      

    安装完vue-cli3.x版本vue-cli2.x版本就被覆盖掉了

    使用vue-cli3.x创建项目

    打开命令行窗口

    •  	window+R 
      

    如果是在桌面创建项目就cd Desktop 进入桌面输入

    •  	vue create 项目名称
      

    如果是在已经创建好的目录中cd 加目录名,进入到项目的目录中输入

    •  	vue create .
      

    输入命令按回车键,这里会让你选择是默认的(default)还是手动的(Manually) ,按键盘上的上下键就可以选择默认的(default)还是手动的(Manually)
    如果选择默认的(default),一直回车执行下去就可以了
    选择手动的(Manually)回车:
    按键盘上的上下键,选择手动的(Manually)
    在这里插入图片描述

    选项配置看个人项目的需求
    	空格键是选中与取消,A键是全选
    	TypeScript 支持使用 TypeScript 书写源码
    	Progressive Web App (PWA) Support PWA 支持。
    	Router 支持 vue-router 。
    	Vuex 支持 vuex 。
    	CSS Pre-processors 支持 CSS 预处理器。
    	Linter / Formatter 支持代码风格检查和格式化。
    	Unit Testing 支持单元测试。
    	E2E Testing 支持 E2E 测试。
    

    根据项目我选择下面这样的
    在这里插入图片描述
    回车后,告诉router路由是使用history模式还是hash模式,这里我选择hash模式,所以我输入no
    在这里插入图片描述
    之后是css的预处理,我选择的是sass
    在这里插入图片描述
    这个是配置文件存放的地方,第一个是独立的文件夹位置,第二个是是在package.json文件里
    这里我选择第一个
    在这里插入图片描述
    回车后有个选择Y/N,这步是告诉你是否保存这次所选好的步骤,输入y就是保存,那么下次再创建项目时直接回=会有个选项,选择那个选项直接回车就可以,输入n就是不保存这次的选择步骤,在下次创建项目时,要自己重新选择配置
    这里我选择n,然后直接回车就安装成功啦

    在这里插入图片描述
    安装成功后,启动项目

    注意:启动项目时,一定要注意是否在项目目录中启动的

    •   	cd my-project //进入到项目目录
        	yarn serve  //启动项目
      

    在这里插入图片描述
    在浏览器访问localhost:8080即可
    在这里插入图片描述
    vue-cli3.0的目录比2.0简洁了很多,没了build和config等目录。若需要其他配置则需要自己手动配置了呢

    如果你仍然需要使用旧版本的 vue init 功能,你可以全局安装一个桥接工具
    npm install -g @vue/cli-init
    vue init webpack my-project

    展开全文
  • 安装nodejs 进入nodejs官网:http://nodejs.cn/download/ 下载后双击安装即可 查看是否安装完成,win+R -> cmd - > 回车 ,输入如下命令 (貌似不用配置环境变量,如果输入如下命令...

    一.安装nodejs

    1. 进入nodejs官网:http://nodejs.cn/download/                                            
    2. 下载后双击安装即可
    3. 查看是否安装完成,win+R -> cmd - > 回车 ,输入如下命令    (貌似不用配置环境变量,如果输入如下命令提示“...不是内部命令...”,请配置环境变量)                                                  

     

     二.安装vue-cli2脚手架 

    1.了解npm与cnpm

    • npm(node package manager)是nodejs的包管理器,用于node插件管理(包括安装、卸载、管理依赖等)
    • cnpm:因为npm安装插件是从国外服务器下载,受网络影响大,可能出现异常,所以用淘宝的镜像替代国外服务器。使下载更快。

    两种方式二选一即可 

    2.npm 方式安装

      指定镜像服务器

       命令"npm -install -g vue-vli" 安装vue-cli脚手架时,因为网络原因(服务器国外的),可能安装失败。我们可通过淘宝镜像安装

    方法一 输入命令:npm install -gd express --registry=http://registry.npm.taobao.org 

    方法二  1.设置npm的下载位置为淘宝镜像,命令 npm config set registry http://registry.npm.taobao.org

    (还原地址:npm config set registry http://registry.npmjs.org) 

                 2.npm install -g vue-cli

    2.cnpm 方式安装 

    2.1 安装cnpm

    1. WIN+R -> CMD -> 回车,cnmp -v 查看是否安装,
    2. 输入命令 : npm install -g cnpm --registry=http://registry.npm.taobao.org
    3. 安装完成后,输入cnmp -v 测试是否安装成功,如下图所示说明安装成功

    2.2 安装vue-cli2

    1.  cnmp install -g vue-cli 或者 cnmp install -gd vue-cli(加d,包含开发环境的安装)
    2. 查看是否安装完成 vue -V (注意是大写的V)

     

     2.3 创建vue-cli2项目

    1. vue init webpack 项目名称(命令全部小写,使用webpack的模板创建),如下图按顺序操作即可

    三. 安装vue-cli3脚手架并创建项目

    卸载vue-cli2

    1.如果安装了vue-cli2,先卸载掉

    如果是npm安装的输入命令 npm uni vue-cli -g 进行卸载,如果是cnpm安装的,则输入 cnpm uni vue-cli -g

    (如果用 npm uni vue-cli -g 卸载不成功就用cnpm uni vue-cli -g试试,没什么科学依据,试试电脑不会爆炸)

     2.安装vue-cli3

    • 普通安装:npm install -g @vue/cli
    • 淘宝镜像安装:cnpm install -g @vue/cli 

    开始安装(安装失败,清楚缓存试试 npm cache clean --force)

    查看是否安装成功 vue -V  (V大写)

    3.创建项目 

    • 图形界面的方式创建项目

    a.启动图形界面 

    不进行详述

    • 通过命令行创建(主流方式)

    a.命令 vue create 项目名称 

    后面的选择默认的即可,然后等待

    展开全文
  • 如何卸载、安装vue-cli的各个版本

    千次阅读 2020-11-16 21:48:23
    卸载、安装vue-cli的各个版本
  • 本地项目安装vue-cli2跟vue-cli3

    千次阅读 2019-05-23 17:17:12
    一般习惯都是安装全局的vue-cli,但是如果想2跟3都可以在本地用起来,那么你就要选择安装在你的本地项目中了! 本地项目安装vue-cli 1、想要在本地项目中安装vue-cli,首先就要把全局的vue-cli给卸载掉。 1、npm...
  • 安装vue-cli过程中卡住

    千次阅读 2021-03-11 16:46:31
      使用官网文档命令安装vue-cli:npm install -g @vue/cli,过程中卡住,很慢 有以下解决方法: (1)安装vue-cli之前确认是否安装nodejs (2)关闭防火墙等软件,避免拦截和无法使用npm安装包 (3)去下载一个...
  • 安装vue-cli 3 VUE脚手架(详细讲解)

    千次阅读 2020-04-10 16:00:38
    安装vue-cli >= 3 VUE脚手架(详细讲解) vue-cli < 3 https://blog.csdn.net/qq_43764578/article/details/102495707这个是之前老版本的讲解 vue-cli >= 3 为什么要安装vue-cli >= 3,首先vue-cli >...
  • 使用vue-ui可视化管理工具来创建项目并安装vue-cli-plugin-element插件
  • 一、安装vue-cli3.0并创建vue项目

    千次阅读 2019-10-21 18:31:11
    1、安装vue-cli3.0,若安装vue-cli2.0先卸载 npm uninstall -g vue-cli 2、安装vue-cli3.0 npm install -g @vue/cli 3、查看vue版本 vue -V 注:无论时卸载还是安装,若有问题,可删除原来的no...
  • 如何安装vue-cli3呢? 首先,你要有一个nodejs环境 Node 版本要求 Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。你可以使用 nvm 或 nvm-windows在同一台电脑中管理多个 Node 版本。 其次,如果你之前安装了...
  • 怎么指定安装 vue-cli3

    2019-12-30 14:02:27
    现在脚手架4已经出来了,如果我直接npm i @vue/cli -g,则默认安装的是4,我要装脚手架3,应该怎么装呀
  • 安装 vue-cli 报错处理方法

    千次阅读 2020-06-04 17:39:16
    今天在安装 vue cli 时遇到以下问题: 解决办法: 首先安装淘宝镜像,以便加快速度:npm install -g cnpm --registry=https://registry.npm.taobao.org 全局更新npm: npm i npm -g 清理缓存: npm cache clean --...
  • 问题描述:npm install vue-cli -g成功安装之后,执行vue -V提示 command not found 1. 使用淘宝镜像:sudo cnpm install vue-cli -g 安装成功后,查看版本 vue -V 提示: -bash: vue: command not found 2. ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 122,653
精华内容 49,061
关键字:

怎么安装vue-cli

vue 订阅