# 全局安装淘宝cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org #升级 npm
cnpm install npm -g # 升级或安装 cnpm
npm install cnpm -g

在用 Vue.js 构建大型应用时推荐使用 NPM 安装:

# 最新稳定版
cnpm install vue

Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用。

# 全局安装 vue-cli
$ cnpm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project # 这一步会因为拉去不到国外的文件而报错,可以参考最下面离线安装的办法
# 这里需要进行一些配置,默认回车即可
This will install Vue 2.x version of the template. For Vue 1.x use: vue init webpack#1.0 my-project ? Project name my-project
? Project description A Vue.js project
? Author runoob <test@runoob.com>
? Vue build standalone
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? Yes vue-cli · Generated "my-project". To get started: cd my-project
npm install
npm run dev Documentation can be found at https://vuejs-templates.github.io/webpack
$ cd my-project
$ cnpm install
$ cnpm run dev
DONE Compiled successfully in 4388ms > Listening at http://localhost:8080

注意:Vue.js 不支持 IE8 及其以下 IE 版本。

离线安装

通过vue-cli工具命令vue init webpack vuedemo创建vue项目的时候报错,提示连接超时,应该是下载某个package的时候,需要FQ,导致出现连接超时。超时错误截图如下:

解决办法是改为离线创建,我们需要下载github仓库中的vue-templates/webpack,然后解压到本地。下载地址为:https://github.com/vuejs-templates/webpack,下载之后,解压到本地用户目录下的.vue-templates目录下。

下载之后的压缩包为webpack-develop.zip,我们解压之后,需要更改目录名为webpack。用户目录下的目录为.vue-templates,注意文件夹名称前面的点(.)。





这样,我们再进行vue init webpack vuedemo命令的时候,需要带上参数--offline表示离线初始化。

安装成功的界面显示:

文件:webpack-develop.zip下载地址:https://files.cnblogs.com/files/sanduzxcvbnm/webpack-develop.zip

使用cnpm创建vue项目(含离线安装)的更多相关文章

  1. 安装配置nodejs并创建Vue项目

    一.下载安装node.js 1.Node.js 官方网站下载:https://nodejs.org/en/ 2.傻瓜式安装 双加安装包,除了根据自己的需要选择安装位置外,都默认下一步. 3.验证安装 ...

  2. 使用vue-cli创建vue项目

    vue-cli是官方发布的vue.js项目脚手架工具,使用它可以快速创建vue项目,github地址:https://github.com/vuejs/vue-cli 1.安装vue-cli //设置 ...

  3. Linux下创建vue项目

    前提:已经安装了node.js.cnpm 1.全局安装vue脚手架vue-cli:#cnpm install -g vue-cli 注意:全局安装没有建立软链接前是无法使用刚刚安装的vue命令的,所以 ...

  4. 快速创建 Vue 项目

    转载:https://www.jianshu.com/p/c7df292915e7 为了便于 Vue 项目的管理, Vue 团队官方开发了 vue-cli 工具. 本文将带您使用 vue-cli 快速 ...

  5. 如何创建vue项目

    Vue项目环境搭建 """ node ~~ python:node是用c++编写用来运行js代码的 npm(cnpm) ~~ pip:npm是一个终端应用商城,可以换国内 ...

  6. vue — 创建vue项目

    创建vue项目 在程序开发中,有三种方式创建vue项目,本地引入vuejs.使用cdn引入vuejs.使用vue-cli创建vue项目.其中vue-cli可以结合webpack打包工具使用,大大方便了 ...

  7. Vue2+Webpack创建vue项目

    相比较AngularJS和ReactJS,VueJS一直以轻量级,易上手称道.MVVM的开发模式也使前端从原先的DOM中解放出来,我们在不需要在维护视图和数据的统一上花大量时间,只需要关注于data的 ...

  8. 通过脚手架创建Vue项目

    第一步 准备工作 1.下载安装Node.js 验证是否安装的方法,在命令行输入node -v 2.安装Vue 在命令行输入npm install -g @vue/cli 查看Vue版本号 npm vu ...

  9. Django day32 跨域问题,创建vue项目,axios的使用

    一:跨域问题 1.同源策略(浏览器的安全策略) 只允许当前页面朝当前域下发请求,如果向其他域发请求,请求可以正常发送,数据也可以拿回,但是被浏览器拦截了 2.cors:只要服务器实现了CORS,就可以 ...

随机推荐

  1. 网络营销谁在行?PHP小哥打个样

    PHP -ゞ 阿白同学的学习笔记 PHP学习笔记 - 01 - web2.0 - 网络营销 @ 目录 一. 前言 二. 开始(借助菜鸟教程平台练习) 1. Hello World -- 第一个案例 2 ...

  2. surging作者出具压测结果

    前言 首先回应下@wen-wen 所贴的压测报告,我也把我和客户压测碰到的问题,和压测结果贴出来,这个结果是由客户提供的.不会有任何的舞弊手脚问题 问题一:Task.Run慎用 首先在最新的社区版本已 ...

  3. Postgres常用SQL

  4. 关于hive分区,你知道多少呢?

    ​ 文末查看关键字,回复赠书 一.理论基础 1.Hive分区背景 在Hive Select查询中一般会扫描整个表内容,会消耗很多时间做没必要的工作.有时候只需要扫描表中关心的一部分数据,因此建表时引入 ...

  5. 什么是hive的静态分区和动态分区,它们又有什么区别呢?hive动态分区详解

    面试官问我,什么是hive的静态分区和动态分区,这题我会呀. 简述 分区是hive存放数据的一种方式,将列值作为目录来存放数据,就是一个分区,可以有多列. 这样查询时使用分区列进行过滤,只需根据列值直 ...

  6. 最佳实践 | 联通数科基于 DolphinScheduler 的二次开发

    点击上方 蓝字关注我们 ✎ 编 者 按 数据时代下,井喷的数据量为电信行业带来新的挑战.面对每日数百 TB 的新增数据,稳定可靠的调度系统必不可少. 中国联通旗下的联通数字科技有限公司(以下简称&qu ...

  7. java学习第四天高级数组.day13

    正则表达式 冒泡排序 二分法查找 线性查找:从头找到尾,性能比较低. 二分法查找(折半查找):前提数组元素是有序的,性能非常优异. Arrays

  8. ASP.NET CORE在docker中的健康检查(healthcheck)

    在使用docker-compose的过程中,很多程序都提供了健康检查(healthcheck)的方法,通过健康检查,应用程序能够在确保其依赖的程序都已经启动的前提下启动,减少各种错误的发生,同时,合理 ...

  9. SiteSucker Pro for Mac 专业的网站下载工具

    SiteSucker Mac版是Mac os平台上的一款帮助用户下载数据的mac下载工具,SiteSucker绝对是一扒网站的利器,不仅仅是下载网站的HTML源文件,他连网站整体架构以及下面的所有文本 ...

  10. WPF开发快速入门【7】WPF的拖放功能(Drag and Drop)

    概述 本文描述WPF的拖放功能(Drag and Drop). 拖放功能涉及到两个功能,一个就是拖,一个是放.拖放可以发生在两个控件之间,也可以在一个控件自己内部拖放.假设界面上有两个控件,一个Tre ...