1. 安装node，命令行输入node-v命令查看是否安装成功。

2. 安装vue：npm install vue-cli -g(全局安装)。

3. 在想要创建vue项目的目录下，按住shift+右键，选择在此处打开命令行窗口。

4. 运行命令：vue init webpack

5. 运行命令：npm install

6. 在所有命令运行完毕后，用npm run dev命令启动项目，然后再本地浏览器中打开项目即可（默认端口号为8080）

7. build为命令存放目录，config为配置目录，dist为最终代码存放目录（上传服务器），src为平时所写代码存放目录，static存放img，css，js文件

报错：在遇到" 'webpack-dev-sever'不是内部或外部命令，也不是可运行的程序或批处理文件"报错时，可删除'node_modules'文件夹，删除package-lock.json文件，依次运行命令：npm install和npm run build,最后运行npm run dev启动项目

用node+webpack+vue新建vue项目步骤的更多相关文章

  1. vue - 新建一个项目

    首先: 要先安装node 及 npm Node.js官方安装包及源码下载地址:http://nodejs.org/ 双击安装,在安装界面一直Next 直到Finish完成安装. 打开控制命令行程序(C ...

  2. vue 新建脚手架项目npm命令

    使用国外原镜像 npm install -g @vue/cli   //yarn global add @vue/cli            使用淘宝镜像 cnpm install -g @vue/ ...

  3. eclipse 新建 maven 项目 步骤（初级入门新手）

    安装 maven(百度) 和在eclipse 中svn(上一篇) 修改 maven 本地仓库 eclipse 属性 maven--> installations-->添加新的 自定义安装的 ...

  4. node+webpack环境搭建 vue.js 2.0 基础学习笔记

    npm install -g vue //全局安装vue npm install -g webpack //全局安装webpack npm install -g vue-cli //全局安装vue-c ...

  5. ruby新建web项目步骤，使用mysql数据库

    1.创建一个项目 指定数据库 rails new demo02 -d mysql 2.修改 config/database.yml 修改数据库密码 default: &default adap ...

  6. Eclipse下Maven新建Web项目index.jsp报错完美解决（war包）

    Eclipse下Maven新建Web项目步骤 1. 2. 3. 4. 5. 问题描述 最近用eclipse新建了一个maven项目,结果刚新建完成index.jsp页面就报错了,先把错误信息贴出来看看 ...

  7. 入坑C++之vs 新建C++项目

    首先呢,下载一个visual  studio 2017的编辑器工具,可能有最新的2019年的版本,根据自己喜欢选择哪个版本就好了 visual studio IDE下载地址:https://visua ...

  8. 从零开始搭建vue移动端项目到上线的步骤

    初始化项目 1.在安装了node.js的前提下,使用以下命令 npm install --g vue-cli 2.在将要构建项目的目录下 vue init webpack myproject(项目目录 ...

  9. vue如何新建一个项目

    第一步:安装node 首先下载安装node 安装步骤参考:https://www.cnblogs.com/qdwz/p/10820554.html window+R打开控制命令行cmd node -v ...

随机推荐

  1. springboot引入AOP

    AOP是Aspect Oriented Programming的缩写,意为面向切面编程.通过预编译方式和运行期动态代理实现程序功能的统一维护的一种技术.AOP是spring框架的一个重要内容,她通过对 ...

  2. (cvpr2019) The Degradation Model and Solution of DPSR

    新的退化模型: $y = (x\downarrow_{s}) \otimes k + n $ 其中$\downarrow_{s}$代表尺度因子为$s$的双三次下采样,$y$表达的是低分辨率图像(经过双 ...

  3. 高校表白APP-冲刺第二天

    今天进行了第二次会议. 一.任务: 昨日任务完成基本登录注册修改页面布局. 今日任务完成登录界面的基本框架. 明日任务登录修改注册跳转,解决真机运行闪退. 二.遇到的困难: 登录界面按钮布局位置,输入 ...

  4. 孙子兵法的计是最早的SWOT分析，《孙子兵法》首先不是战法，而是不战之法。首先不是战胜之法，而是不败之法

    孙子兵法的计是最早的SWOT分析,<孙子兵法>首先不是战法,而是不战之法.首先不是战胜之法,而是不败之法 在打仗之前,你要详细地去算. 计算的目的是什么呢?孙子说,是为了知胜,就是为了知道 ...

  5. KVO的使用二：常用方法及小技巧

    (文章及代码接上一篇) options详解: KVO的注册方法中有一个options枚举,用来确定观察者的接收消息方法接收的信息,那么具体有什么关联呢?下面通过一段代码来验证是如何关联的.依次选择op ...

  6. redis恢复(aof)

    ----------------redis备份恢复方法-----------------------------1.采用aof恢复方法若appendonly设置为no的情况下,在每个节点上执行bgre ...

  7. lsyncd+rsync配置图片资源双向同步

    需求:为保证国内外图片加载速度,国内请求上传图片资源地址阿里云oss,国外请求上传图片资源地址aws s3,为保证图片资源的一致性,需定时进行oss和s3图片双向同步 调研方案:由于之前配置过inot ...

  8. Lesson 02-Linux基础命令(一)

    查看系统IP Linux:ifconfig/ip a Windows:ipconfig vi:创建文件并编辑 touch:创建空文件 mkdir ~/a 在用户家目录下创建名称为a的文件夹 -p 创建 ...

  9. qt 串口

    if(ui->connectSerialBtn->text() == tr("打开串口")) { //ui->showSerialInfo->setEnab ...

  10. 清华源和中科大源都停止对Anaconda的支持之后，换腾讯云镜像的方法

    直接下载下面的文件解压后放在用户文件夹下即可,windows为"C:\用户\你的用户名\",Linux为"/home/你的用户名/"即用户主目录下. 点我下载 ...