使用vue开发项目的前期工作可以参考前面写的:  Vue环境搭建及node安装过程整理

Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置,带来现代化的前端开发流程。

只需几分钟即可创建并启动一个带热重载、保存时静态检查以及可用于生产环境的构建配置的项目:

# 全局安装 vue-cli
$ npm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
$ vue init webpack test     //输入命令

? Project name (test) test
? Project name test
? Project description (A Vue.js project) 测试项目
? Project description 测试项目
? Author lxx1024
? Author lxx1024
? Vue build standalone
? Install vue-router? (Y/n) Y //安装路由
? Install vue-router? Yes
? Use ESLint to lint your code? (Y/n) n //Eslint验证,很严谨,所以选择n
? Use ESLint to lint your code? No
? Setup unit tests with Karma + Mocha? (Y/n) Y
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? (Y/n) Y
? Setup e2e tests with Nightwatch? Yes vue-cli · Generated "test". To get started: cd test
npm install
npm run dev Documentation can be found at https://vuejs-templates.github.io/webpack
# 安装依赖,走你
$ cd my-project    //进入到项目的根目录--直接进入到该文件夹即可
$ npm install        //安装依赖包
$ npm run dev     //运行项目
 
下面是运行结果
> npm install

> phantomjs-prebuilt@2.1. install C:\Users\\Desktop\test\node_modules\phantomjs-prebuilt
> node install.js PhantomJS not found on PATH
Downloading https://github.com/Medium/phantomjs/releases/download/v2.1.1/phantomjs-2.1.1-windows.zip
Saving to C:\Users\\AppData\Local\Temp\phantomjs\phantomjs-2.1.-windows.zip
Receiving... Error making request.
Error: connect ETIMEDOUT 54.231.81.168:
at Object.exports._errnoException (util.js::)
at exports._exceptionWithHostPort (util.js::)
at TCPConnectWrap.afterConnect [as oncomplete] (net.js::) Please report this full log at https://github.com/Medium/phantomjs
test@1.0. C:\Users\\Desktop\test
+-- autoprefixer@7.1.
| +-- browserslist@2.5.
| | `-- electron-to-chromium@1.3.
| +-- caniuse-lite@1.0.
| +-- normalize-range@0.1.
.................
.................
| +-- html-entities@1.2.
| +-- querystring@0.2.
| `-- strip-ansi@3.0.
| `-- ansi-regex@2.1.
`-- webpack-merge@4.1. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0. (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN karma-sinon-chai@1.3. requires a peer of sinon@^2.1. but none was installed.
npm ERR! Windows_NT 10.0.
npm ERR! argv "E:\\nodejs\\node.exe" "E:\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install"
npm ERR! node v6.11.4
npm ERR! npm v3.10.10
npm ERR! code ELIFECYCLE npm ERR! phantomjs-prebuilt@2.1. install: `node install.js`
npm ERR! Exit status
npm ERR!
npm ERR! Failed at the phantomjs-prebuilt@2.1. install script 'node install.js'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the phantomjs-prebuilt package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! node install.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs phantomjs-prebuilt
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls phantomjs-prebuilt
npm ERR! There is likely additional logging output above. npm ERR! Please include the following file with any support request:
npm ERR! C:\Users\\Desktop\test\npm-debug.log
> npm run dev
> node build/dev-server.js > Starting dev server...
DONE Compiled successfully in 15700ms23:: > Listening at http://localhost:8080

使用命令行工具npm新创建一个vue项目的更多相关文章

  1. 开始创建一个 Vue 项目

    开始创建一个 Vue 项目 安装 nodejs 略 安装 npm 默认安装时自带了 npm 安装 cnpm 为了更快的下载组件,使用cnpm,cnpm 是淘宝前端的镜像. 使用 npm 安装 cnpm ...

  2. 创建一个vue项目的过程

    创建一个vue项目: 1.首先从UI手上拿到PSD设计图,然后看设计搞的内容,需要做个大概的页面布局 2.做vue之前不许安装node,因为做vue项目要和node结合使用 3.然后安装vue脚手架: ...

  3. 新手如何创建一个vue项目 ---vue---新手创建第一个项目

    1.第一步安装node.js https://nodejs.org/en/ 前期可以下载软件包,后期熟练以后可以通过nvm进行 Node的版本切换以及升级 然后window+r  输入cmd 打开命令 ...

  4. 使用VSCode创建一个Vue项目

    vue-cli 是vue.js的脚手架,用于自动生成vue.js模板工程的. 安装vue-cli之前,需要先安装了vue和webpack · node -v          //(版本低引起:bas ...

  5. 创建一个vue 项目 必备的几个插件

    第一步npm安装 首先:先从nodejs.org中下载nodejs 打开控制命令行程序(CMD),node -v 检查是否正常 使用淘宝NPM 镜像 npm  install  -g  cnpm  - ...

  6. 创建一个vue项目,vue-cli,webpack

    ,换成淘宝源: npm config set registry https://registry.npm.taobao.org/ 检查是否修改成功 npm config get registry ,安 ...

  7. 使用vue-cli创建一个vue项目

    安装vue-cli npm install -g @vue/cli 1, 使用vue创建一个项目 vue create luffy 2, 安装所需的插件 npm install vue-router ...

  8. 如何利用vue脚手架创建一个vue项目

    1.安装node.js 2.打开命令行查看下npm和node是否都安装好 node -v npm -v 3.安装淘宝镜像cnpm $ npm install -g cnpm --registry=ht ...

  9. 快速创建一个vue项目

    vue脚手架 用来创建vue项目的工具包 创建项目: npm install -g vue-cli vue init webpack VueDemo 开发环境运行: cd VueDemo npm in ...

随机推荐

  1. const修饰指针时应注意的问题

    1.指向常量的指针 顾名思义,一个指针指向const对象,则称它为指向常量的指针. ; int* ptr=&a; //错误 const int* ptr=&a; //必须用const来 ...

  2. s11.1 lsof:查看进程打开的文件

    功能说明 lsof 全名为list open files,也就是列举系统中已经被打开的文件,通过lsof命令,就可以根据文件找到对应的进程信息,也可以根据进程信息找到进程打开的文件. [语法格式] l ...

  3. 添加网络ADB的方法(含以太网和无线)

    将下面代码添加至packages/apps/Settings/src/com/android/settings/DevelopmentSettings.java 结合之前的添加wifi adb的博客 ...

  4. ASP.NET 日志组件Smart.LogNet.DLL 引用即可写入日志及读取日志

    借助LogNet组件,以后查看站点日志,再也不用去服务器下载了 日志组件:LogNet.DLL ,引用即可使用 写入方法: 1.LogNet.Log.WriteLog("日志标题" ...

  5. Ng第十课:应用机器学习的建议(Advice for Applying Machine Learning)

    10.1  决定下一步做什么 10.2  评估一个假设 10.3  模型选择和交叉验证集 10.4  诊断偏差和方差 10.5  归一化和偏差/方差 10.6  学习曲线 10.7  决定下一步做什么 ...

  6. Android学习指南之三十八:Android手势操作编程[转]

    手势操作在我们使用智能设备的过程中奉献了不一样的体验.Android开发中必然会进行手势操作方面的编程.那么它的原理是怎样的呢?我们如何进行手势操作编程呢? 手势操作原理 首先,在Android系统中 ...

  7. noip2017d1t3

    其实是参考洛谷上某篇题解的思路: 先求出两个dis数组表示从1走和从n走的最短路: 转移方程:dp[v][dis1[u]-dis1[v]+w+j]+=dp[u][j]; 转移顺序要注意一下呢,肯定是先 ...

  8. kepware http接口 swift

    读取某变量的值 import Foundation let headers = [ "Connection": "keep-alive", "Cach ...

  9. spring父子Ioc容器的关系

    在网上找了一下,没有直接解说ioc父子容器关系的文章,所以大概看了下代码,自己写下吧,写俩行做个笔记. 1. 在进行dean的注册的时候,父容器和子容器是互不干扰的,各自注册自己的 2. 在实例化的时 ...

  10. 3D打印软件工具

    切片与工艺规划(打印)软件: 3D打印中另外两个重要的步骤(切片和打印)中可以用到的一些开源,免费的软件和应用 Cura        开源, 免费                    Python ...