Mac (cnpm安装、vue-cli安装、第一个vue-cli程序)

首先安装node#官网下载安装包，傻瓜式安装：https://nodejs.org/zh-cn/淘宝镜像安装cnpm，#在终端输入：npm install -g cnpm --registry=https://registry.npm.taobao.org失败显示npm set registry https://registry.npm.taobao.orgnpm set disturl http

Cyril-zxy

1670人浏览 · 2021-08-01 02:08:31

Cyril-zxy · 2021-08-01 02:08:31 发布

安装cnpm

首先安装node#
官网下载安装包，傻瓜式安装：https://nodejs.org/zh-cn/

淘宝镜像安装cnpm，#
在终端输入：
npm install -g cnpm --registry=https://registry.npm.taobao.org

失败显示
在这里插入图片描述

npm set registry https://registry.npm.taobao.org
npm set disturl https://npm.taobao.org/dist
npm cache clean --force

上面三行命令完成后，再次输入步骤二的命令：
npm install -g cnpm --registry=https://registry.npm.taobao.org
如果一切正常，输入下面的命令，查询是否安装成功：cnpm -v 如果出现下面的版本信息，说明cnpm安装成功

成功！
cnpm@5.1.1 (/usr/local/lib/node_modules/cnpm/lib/parse_argv.js) 
npm@5.5.1 (/usr/local/lib/node_modules/cnpm/node_modules/npm/lib/npm.js) 
node@8.9.0 (/usr/local/bin/node) 
npminstall@3.2.1 (/usr/local/lib/node_modules/cnpm/node_modules/npminstall/lib/index.js) 
prefix=/usr/local 
darwin x64 16.7.0 
registry=http://registry.npm.taobao.org

加权限再试一下
sudo npm install -g cnpm --registry=https://registry.npm.taobao.org --verbose

查询是否安装成功
cnpm -v
在这里插入图片描述

问题记录
https://zhuanlan.zhihu.com/p/158241878

vue-cli安装

sudo cnpm install vue-cli -g
在这里插入图片描述

vue list
在这里插入图片描述

第一个vue-cli程序

创建vue项目
vue init webpack myvue

下载
zhangxinyue@localhost myvue % npm install 或者 cnpm install

启动当前项目，结束可访问http://localhost:8080
zhangxinyue@localhost myvue % npm run dev

zhangxinyue@localhost Documents % cd WebstormProject
zhangxinyue@localhost WebstormProject % ls
ks	study
zhangxinyue@localhost WebstormProject % vue init webpack myvue

? Project name myvue
? Project description A Vue.js project
? Author zxy <zhangxinyue31@tal.com>
? Vue build standalone
? Install vue-router? No
? Use ESLint to lint your code? No
? Set up unit tests No
? Setup e2e tests with Nightwatch? No
? Should we run `npm install` for you after the project has been created? (recom
mended) no

   vue-cli · Generated "myvue".

# Project initialization finished!
# ========================

To get started:

  cd myvue
  npm install (or if using yarn: yarn)
  npm run dev
  
Documentation can be found at https://vuejs-templates.github.io/webpack

zhangxinyue@localhost WebstormProject % cd myvue
zhangxinyue@localhost myvue % npm install 或者 cnpm install

✔ Installed 36 packages
✔ Linked 0 latest versions
✔ Run 0 scripts
✔ All packages installed (used 63ms(network 55ms), speed 0B/s, json 0(0B), tarball 0B)
zhangxinyue@localhost myvue % npm run dev

> myvue@1.0.0 dev
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

(node:80735) [DEP0148] DeprecationWarning: Use of deprecated folder mapping "./2020/" in the "exports" field module resolution of the package at /Users/zhangxinyue/Documents/WebstormProject/myvue/node_modules/es-abstract/package.json.
Update this package.json to use a subpath pattern like "./2020/*".
(Use `node --trace-deprecation ...` to show where the warning was created)
(node:80735) [DEP0148] DeprecationWarning: Use of deprecated folder mapping "./helpers/" in the "exports" field module resolution of the package at /Users/zhangxinyue/Documents/WebstormProject/myvue/node_modules/es-abstract/package.json.
Update this package.json to use a subpath pattern like "./helpers/*".
(node:80735) [DEP0111] DeprecationWarning: Access to process.binding('http_parser') is deprecated.
 13% building modules 25/29 modules 4 active ...nts/WebstormProject/myvue/src/App.vue{ parser: "babylon" } is deprecated; we now treat it as { parser: "babel" }.
 95% emitting                                                                 b      
 DONE  Compiled successfully in 3318ms                               下午5:01:17

 I  Your application is running here: http://localhost:8080