如何建立和运行vue项目

第一步,肯定是安装node.js。根据需要下载安装,安装后如图,然后进行下一步

打开命令提示符(win+r),然后进行下一步;

node -v 检查node是否安装成功

npm -v 检查npm是否安装成功

cnpm -v 是否安装成功

安装cnpm,由于npm有些资源被屏蔽,儿有些是国外资源的原因, 会导致安装依赖的时候失败,这里安装cnpm国内镜像。输入如下命令:

npm install -g cnpm --registry=http://registry.npm.taobao.org。然后等待,进行下一步

安装vue-cli,如图,输入 cnpm install -g vue-cli ,等待完成。然后进行下一步

把当前路径改到你要存放项目的路径,此处,如图,为演示方便,我们放在桌面上:然后进行下一步:

在当前文件下用vue init webpack firstVue  初始化一个项目:然后进行下一步:

在桌面有如下文件夹,表示建立成功:然后进行下一步:

注意:我在这里遇到一个问题

在安装完node.js后,也用cnpm代替了npm,然后使用cnpm在node.js的安装路径下安装了vue-cli:cnpm install --global vue-cli。然后使用vue init webpack my-project建立一个项目

之前安装时在最后一个选项上选择了 npm install ,结果后面卡住了(当时没有去截图),强制退出后,执行npm run dev就报错了。

最终解决办法就是在最后一个选项上选择No,I can handle it myselft,然后cd my-project,然后cnpm install,这样就成功了,然后执行npm run dev就出现:

原文地址:https://www.cnblogs.com/wanqingcui/p/9745963.html

时间: 2024-10-14 07:39:14

如何建立和运行vue项目的相关文章

如何在mac上运行vue项目

使用终端安装Vue运行环境 1.安装 Homebrew Homebrew 是osx下面最优秀的包管理工具,没有之一.先在终端查看是否已安装brew brew -v 如果返回 Homebrew 的版本号 例如:Homebrew 1.3.6 那么恭喜你,可以跳过这一步,如果没有,那就乖乖执行第一步. /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)&quo

从零开始VUE(一)运行Vue项目

1.安装nodejs,可以去官网下载,安装完成后在命令行输入node -v或npm -v,若正确显示版本,表示安装成功. 2.设置国内镜像(老外的网站有点慢) npm install -g cnpm --registry=https://registry.npm.taobao.org 3.命令行进入项目根目录,安装项目所需的依赖 npm install 4.运行项目 npm run dev 原文地址:https://www.cnblogs.com/soup227/p/9322604.html

首次运行 vue 项目

首先运行项目需要考虑如何执行,我用的是编辑器是pycharm,在pycharm中可以直接执行项目,第一是用命令行执行,第二比较简单,配置执行器来执行.下面简单讲一下配置执行器. 第一步 点击运行配置按钮,点击配置,进入配置页面,点击添加按钮,添加npm,点击确定.   第二步 配置执行器.Name可以配置成你需要的名字,package.json选择项目中的package.json路径,Scripts选择serve,配置完毕,点击应用apply,最后点击OK. 配置完毕. 执行成功. 下面配置 e

VsCode创建第一个vue项目

使用vue-cli快速构建项目  ( vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. 安装vue-cli之前,需要先安装了vue和webpack ) · node -v //(版本低引起:bash: npm: command not found) · npm -v //以上帮助检查是否安装 node npm · 输入vue,//测试vue是否安装成功 · 输入vue list  //看vue中有哪些子类 npm install vue npm install -g

vue学习一:新建或打开vue项目

1.前期准备: node.js环境,安装node npm或者cnpm(npm的淘宝镜像,在命令行中输入 npm install -g cnpm --registry=http://registry.npm.taobao.org.由于有些npm有些资源被屏蔽或者是国外资源的原因,经常会导致用npm安装依赖包的时候失败,所以需要npm的国内镜像---cnpm) vue-cli 脚手架构建工具,构建项目(在命令行中运行命令 cnpm install -g vue-cli) 2.用vue-cli构建项目

Vue - 项目开发

Vue项目开发 环境 1)安装node:官网下载安装包,傻瓜式安装:https://nodejs.org/zh-cn/ 2)安装cnpm >:npm install -g cnpm --registry=https://registry.npm.taobao.org 3)安装脚手架 >:cnpm install -g @vue/cli 4)清空缓存处理(如果第2.3补出问题可以执行该条命令) >:npm cache clean --force 创建项目 >: cd 项目目录 >

vue项目搭建和运行

在师兄的推荐下入坑vue.js ,发现不知如何运行GitHub上的开源项目,很尴尬.通过查阅网上教程,成功搭建好项目环境,同时对前段工程化有了朦朦胧胧的认知,因此将环境搭建过程分享给大家. 首先,列出来我们需要的东西: node.js环境(npm包管理器) vue-cli 脚手架构建工具 cnpm  npm的淘宝镜像 安装node.js 从node.js官网下载并安装node,安装过程很简单,一路"下一步"就可以了(傻瓜式安装). 安装完成之后,打开命令行工具,输入 node -v,如

Vue 项目: npm run dev b报错 “'webpack-dev-server' 不是内部或外部命令,也不是可运行的程序 或批处理文件。”

前提: 电脑已经安装了nodeJS和npm,  项目是直接下载的zip包. 报错步骤为1:cd /d 目录: 2. npm ren dev  -------> 报错如下: > webpack-dev-server --inline --progress --config build/webpack.dev.conf.js 'webpack-dev-server' 不是内部或外部命令,也不是可运行的程序或批处理文件.npm ERR! code ELIFECYCLEnpm ERR! errno 1

Vue项目碰到"‘webpack-dev-server’不是内部或外部命令,也不是可运行的程序或批处理文件"报错

最近公司里做vue项目,svn了前端同事的项目代码,装好环境,运行项目(安装步骤随便百度一下,很详细),控制台里报错“‘webpack-dev-server’不是内部或外部命令,也不是可运行的程序或批处理文件,随机百度解决方法,有的说需要重新装依赖包,有的说扩展用户权限,都做了,但是报错依旧. 原因: 随机自己新建一个vue项目(https://segmentfault.com/a/1190000009871504),发现没有报错,于是可以肯定是svn下来的项目代码有问题, 解决办法: 最后将项