Idea初始化Vue项目

环境搭建

检测是否安装好nodejs和npm

node -v
npm -v

如果没有安装需要先安装node

nodejs的下载路径:https://nodejs.org/en/download/

在Windows上安装时务必选择全部组件,包括勾选Add to Path。

安装完成后,打开命令提示符重新检查版本。

安装vue.js

打开cmd,输入:npm install vue

安装vue-cli,vue脚手架

npm install -g @vue/cli

测试是否安装成功

vue -V

使用taobao镜像

在cmd中直接使用npm来安装的一些工具的话会比较慢,所以我们使用淘宝的npm镜像:

方法一:输入

npm i -g cnpm --registry=https://registry.npm.taobao.org

即可安装npm镜像,以后再用到npm的地方直接用cnpm来代替就好了 ,如果权限不够,请使用管理员运行命令提示符

方法二:[推荐]

npm config set registry https://registry.npm.taobao.org

设置npm代理,后续直接使用npm install 即可;

使用idea新建vue项目

如果没有vue.js选项,idea安装vue.js的插件即可

使用vue init webpack projectName初始化项目

projectName是项目名。

接下来会要求你进行一些选项设置,其实就是初始化项目:

? Project name (test)        // 项目名称
? Project name test
? Project description (A Vue.js project)        // 项目描述
? Project description A Vue.js project
? Author (villelee)        // 作者
? Author villelee
? Vue build (Use arrow keys)        // 开始选项设置
? Vue build standalone
? Install vue-router? (Y/n) Y        // 安装路由
? Install vue-router? Yes
? Use ESLint to lint your code? (Y/n) Y        // 是否使用ESlint统一代码风格
? Use ESLint to lint your code? Yes
? Pick an ESLint preset (Use arrow keys)
> Standard (https://github.com/standard/standard)
? Pick an ESLint preset Airbnb
? Set up unit tests (Y/n) n        // 是否安装单元测试
? Set up unit tests No
? Setup e2e tests with Nightwatch? (Y/n) n        // 是否安装e2e测试
? Setup e2e tests with Nightwatch? No
? Should we run `npm install` for you after the project has been created? (recom
? Should we run `npm install` for you after the project has been created? (recom
mended) npm
   vue-cli · Generated "test".

最后出现如下代码:

To get started:

  cd test
  npm run dev

说明已经初始化成功,vue-cli已经将必要的依赖包都下好了,可以正常跑起来了。

$ npm run dev

> test@1.0.0 dev D:ptest	est
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

 95% emitting DONE  Compiled successfully in 5547ms11:59:13

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

相关错误处理

Can not install 'ij-rpc-client': npm ERR! code ECONNRESET

详细信息如下:

Can not install 'ij-rpc-client': npm ERR! code ECONNRESET
npm ERR! errno ECONNRESET
npm ERR! network request to https://registry.npmjs.org/ij-rpc-client failed, reason: read ECONNRESET
npm ERR! network This is a problem related to network connectivity.
npm ERR! network In most cases you are behind a proxy or have bad network settings.
npm ERR! network
npm ERR! network If you are behind a proxy, please make sure that the
npm ERR! network 'proxy' config is set properly. See: 'npm help config'

npm ERR! A complete log of this run can be found in:
npm ERR! C:UsersLJAppDataRoaming
pm-cache_logs2019-11-03T08_31_08_260Z-debug.log

解决办法:

清除、卸载vue缓存
 npm uninstall -g vue 
 npm uninstall -g vue-cli 
 npm uninstall -g @vue/cli 
 npm cache clean --force 

重新安装 
npm install vue
npm install -g @vue/cli

**重点**
查询、更改npm下载地址
npm get registry https://registry.npmjs.org/ 
npm config set registry http://registry.npm.taobao.org/ 
npm get registry http://registry.npm.taobao.org/

vue init webpack projectName 报错

错误信息:'git' 不是内部或外部命令,也不是可运行的程序或批处理文件

下载安装git
配置git环境变量,将git命令路径添加到PATH,如:C:Program FilesGitin

原文地址:https://www.cnblogs.com/tinging/p/13157685.html