# 全局安装淘宝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. httpdns是个什么技术,有什么用

    dns解析现状问题1:暴利的dns劫持 要说为啥会出现httpdns(先不用管意思,后面解释),那么,首先要说一下,现在的dns解析,是不是有啥问题? dns能有啥问题呢,就是输入一个域名xxx.co ...

  2. 4-2 Spring MVC框架-01

    Spring MVC框架-01 Ⅰ.接收客户端请求 1. 关于Spring MVC框架 Spring MVC是基于Spring框架基础之上的 作用: 接收请求,响应结果,处理异常 主要解决了后端服务器 ...

  3. jdbc 02: 连接mysql,并实现删除与更新

    jdbc连接mysql,并实现删除与更新 package com.examples.jdbc.o2_删除与更新; import java.sql.*; //连接与插入 /* jdbc删除操作 */ p ...

  4. 特殊的阻塞队列 - java.util.concurrent.SynchronousQueue 分析

    描述 SynchrounousQueue 是一个比较特殊的无界阻塞队列并支持非公平和公平模式,严格意义上来说不算一个队列,因为它不像其他阻塞队列一样能有容量,它仅有一个指向栈顶的地址,栈中的节点由线程 ...

  5. 华为分析&联运活动,助您提升游戏总体付费

    ARPU如何提升?付费率如何提升?活动ROI如何提升?这些都是游戏运营人员较常遇到的难题.华为分析与联运活动可以帮助运营提升这些用户付费指标,通过对玩家打标签和用户画像,对目标群体的进行精准推送,实现 ...

  6. 【springcloud】环境搭建与Rest使快速上手

    SpringCloud环境搭建 --- Rest使用 个人主页:https://www.cnblogs.com/xbudian/ 今天来到SpringCloud的学习,我们从spring boot微服 ...

  7. OpenSSF的开源软件风险评估工具:Scorecards

    对于IT从业者来说,Marc Andreessen 十年前提出"软件吞噬世界"的观点早已耳熟能详.无论是私人生活还是公共领域,软件为现代社会的方方面面提供动力,对现代经济和国家安全 ...

  8. 大家都能看得懂的源码(一)ahooks 整体架构篇

    本文是深入浅出 ahooks 源码系列文章的第一篇,该系列已整理成文档-地址.觉得还不错,给个 star 支持一下哈,Thanks. 第一篇主要介绍 ahooks 的背景以及整体架构. React h ...

  9. 用VS Code搞Qt6:至简窗口部件——QWidget

    在正题开始之前,老周照例扯点别的.嗯,咱们扯一下在 VS 2022 下结合 CMake 开发 Qt6 时的环境变量设置问题.在VS Code 中,通够通过 CMake Tools 扩展的配置来设置环境 ...

  10. B/S结构通信系统原理

    本文介绍JavaWeb的B/S结构通信原理 概念:        Javaweb中B/S架构是一种系统架构形式,这里的B是Browser(浏览器),S是Server(服务器),是一种系统的架构形式,有 ...