笔者工作也有一些时间,需要用vue写项目时也总是项目组长已经把项目搭建好了,

偶尔心血来潮想试着自己搭建一个vue项目

我们搭建vue项目呢主要是用到了vue-cli来搭建,但是前提是必须要已经安装好了node和npm

如果你还没安装这些东西,就先去安装再来学习搭建vue项目吧

一、安装vue-cli

1. 开启命令行,输入指令(Windows的命令行开启方法为  键盘上的 开始键 + R 同时按下,然后输入 cmd 就能打开命令行了)

npm install --global vue-cli  (--global全局安装)

那如果安装好了我们怎么查看的到是否已经安装好了呢?

其实已经在我们本地了

本地路径为  C:\Users\Administrator\AppData\Roaming\npm

里面的文件大概长这个样子

那么vue-cli我们就安装好了

二、创建自己的项目

1. 随便找一个文件夹(这里我以桌面 test文件夹 为例)

在cmd中进入到该文件夹

我这里呢  使用的进入命令(cd)  一步一步进入到桌面test文件夹的

你也可以在命令行中  拖入文件夹   这样就可以直接进入到该文件夹

然后输入命令

vue init webpack vue项目   (“vue项目” 是我项目的名称,你也可以换一个名称)

之后呢,cmd就会对你提问,我直接把回答好的图放出来吧

等待它下载完成,就好了

我们就可以去到文件夹里面查看项目了

之后我们的运行指令是

npm run dev

一个简单的vue项目就搭建好了鸭

教你如何搭建vue项目的更多相关文章

  1. 手把手教你用vue-cli搭建vue项目

    手把手教你用vue-cli搭建vue项目 本篇主要是利用vue-cli来搭建vue项目,其中前提是node和npm已经安装好,文章结尾将会简单提到一个简单的例子.使用vue-cli搭建项目最开始我也是 ...

  2. 利用vue-cli搭建vue项目

    手把手教你用vue-cli搭建vue项目 本篇主要是利用vue-cli来搭建vue项目,其中前提是node和npm已经安装好,文章结尾将会简单提到一个简单的例子.使用vue-cli搭建项目最开始我也是 ...

  3. 手把手教你如何搭建iOS项目基本框架

    手把手教你如何搭建iOS项目基本框架 今天我们来谈谈如何搭建框架,框架需要做一些什么. 第一步:找到我们的目标我们的目标是让其他开发人员拿到手后即可写页面,不再需要考虑其他的问题. 第二步:我们需要做 ...

  4. 搭建vue项目环境

    前言 在开发本项目之前,我对vue,react,angular等框架了解,仅限于知道它们是什么框架,他们的核心是什么,但是并没有实际使用过(angular 1.0版本用过,因为太难用,所以对这类框架都 ...

  5. element-ui和npm、webpack、vue-cli搭建Vue项目

    一.element-ui的简单使用 1.安装 1. npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm i element-ui -S 2. CDN ...

  6. 快速搭建Vue项目

    快速搭建Vue项目 第一次安装vue项目Vue推荐开发环境Node.js 6.2.0.npm 3.8.9.webpack 1.13.vue-cli 2.5.1.webstrom2016 安装环境: 安 ...

  7. Visual code 搭建Vue项目

    使用VS Code搭建Vue项目 1.安装 VScode 2..安装最新node.JS 2.安装cnpm镜像  淘宝镜像(node自带安装了npm,故不再安装) npm install -g cnpm ...

  8. vue-cli搭建vue项目更新

    vue-cli搭建vue项目更新 更新之前一篇博客错误的地方,在使用vue init webpack xxx 之后并不需要使用npm install 下载依赖包,而是直接根据提示 打开文件夹 再npm ...

  9. 用vue-cli来搭建vue项目和webpack

    vue-cli 用vue-cli来搭建vue项目 第一步:全局安装vue-cli sudo npm install vue-cli -g 第二步:初始化一个项目 vue init webpack-si ...

随机推荐

  1. AC日记——送花 洛谷 P2073

    送花 思路: 线段树: 代码: #include <bits/stdc++.h> using namespace std; #define maxn 100005 struct TreeN ...

  2. web前端零基础入门学习!前端真不难!

    现在互联网发展迅速,前端也成了很重要的岗位之一,许多人都往前端靠拢,可又无能为力,不知所措,首先我们说为什么在编程里,大家都倾向于往前端靠呢?原因很简单,那就是,在程序员的世界里,前端开发是最最简单的 ...

  3. coercing to Unicode错误的一个解决办法

    http://blog.csdn.net/happen23/article/details/46683813

  4. 【剑指offer】面试题 5. 替换空格

    面试题 5. 替换空格 题目:请实现一个函数,将一个字符串中的空格替换成"%20".例如,当字符串为We Are Happy. 则经过替换之后的字符串为We%20Are%20Hap ...

  5. Nodejs Bot学习

    关于示例部分可以参考<BotFramework Nodejs示例><BotBuilder Nodejs示例查看> Bot Framework Nodejs SDK包括几种与用户 ...

  6. [BZOJ4836]二元运算(分治FFT)

    4836: [Lydsy1704月赛]二元运算 Time Limit: 8 Sec  Memory Limit: 128 MBSubmit: 578  Solved: 202[Submit][Stat ...

  7. 【推导】【数学期望】Gym - 101237D - Short Enough Task

    按照回文子串的奇偶分类讨论,分别计算其对答案的贡献,然后奇偶分别进行求和. 推导出来,化简一下……发现奇数也好,偶数也好,都可以拆成一个等比数列求和,以及一个可以错位相减的数列求和. 然后用高中数学知 ...

  8. 输入sql语句,将结果写入到xml文件

    import java.io.FileOutputStream; import java.sql.Connection; import java.sql.DriverManager; import j ...

  9. struts2和spring整合错误 org.springframework.beans.factory.BeanCreationException,已解决

    先贴上错误 2018-8-16 23:41:10 org.springframework.context.support.ClassPathXmlApplicationContext prepareR ...

  10. Android测试之Keycode

    问题: 昨天做测试Case,发现一个网游APK运行界面,uiautomator无法捕捉获取. 因而输入的时候只得运用(dut.onclick(int a, int y))坐标点击的方法来输入用户名和密 ...