基于Visual Studio Code配置Vue环境

基于Visual Studio Code配置Vue环境

每日一句英语

The secret of success in life is for a man to be ready for his opportunity when it comes. 人生成功的秘诀是当机遇来临时要及时地抓住它。

需要用到的软件

node.js(最好是12或13的版本) 下载链接为:https://nodejs.org/en/

git 下载链接为:https://nodejs.org/en/

Visual Studio Code 下载链接为:https://code.visualstudio.com/download

下载一个node.js（直接点下一步即可）

• 通过node -v测试是否安装成功，出现版本号即安装成功，否则安装失败

安装淘宝的cnpm管理器

• 通过在cmd上输入npm install –g cnpm –registry=http://registry.npm.taobao.org来安装
• 通过cnpm -v来测试是否安装成功,与如下图片所示即安装成功
• [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-97k25TDJ-1598538603256)(C:\Users\wanjie666\AppData\Roaming\Typora\typora-user-images\image-20200827220817451.png)]

下载git（直接点下一步即可）

• 通过git --version测试是否安装成功，出现版本号即安装成功，否则安装失败
  

安装Visual Studio Code（直接点下一步即可）

• 在Visual Studio Code打开需要配置Vue的项目

  • 通过File -->open file folder来我们指定的文件

• 为项目安装依赖

  • 进入指定项目的目录中

    • 先选中刚才的文件

    • 点击Terminal

    • 在面板中通过cd xxxx进入需要配置Vue的项目路径

    

  • 通过cnpm install来为项目安装依赖，操作如下所示

  

  • 如果报如下图所示的错误，则是由于在windows10中，经常会由于系统安全，不允许我们在第三方的terminal中直接调用命令，所以需要在powershell中进行授权，解决方法网址为：https://www.cnblogs.com/500m/p/11634969.html
    

  • 最后通过npm run dev来运行项目,操作如下

    

遇到的问题与解决方案

• 问题，如下图所示：
  

• 解决方案：此类问题是由于路径配置不正确，重点查找这方面的问题

• 问题2，如下图所示：
  

• 解决方案：