本文记录一下在vscode搭建vue环境过程新手小白想和大家一起学习讨论~

一、安装nodejs

官网链接nodejs官网
根据个人电脑型号显示进行下载安装时注意指定安装路径,然后一直选择next即可

二、配置环境变量

1.在nodejs安装目录新建node_cachenodejs缓存)、node_global全局存放两个文件夹如下所示
在这里插入图片描述
2. 打开cmd命令提示符,配置文件路径如下
在这里插入图片描述
3. 配置环境变量
系统属性->高级->环境变量->新增环境变量
在这里插入图片描述
结果如下所示:
在这里插入图片描述

在这里插入图片描述

三、vscode搭建vue环境

1. 安装插件:①ESLint用于统一JavaScript代码风格的工具。②

2. 在vscode终端输入以下命令

npm i -g @vue/cli

报错
npm : 无法将npm”项识别cmdlet函数脚本文件或可运行程的名称...
关闭vscode选择管理员身份再次打开,或者检查环境变量是否配置正确

安装webpackjs打包工具

npm install -g webpack

检查nodenpmvue版本

node -v
npm -v 
vue -V

注意vue -V,若报错
vue : 无法加载文件 D:nodejsnode_globalvue.ps1,因为在此系统上禁止运行脚本...
先以管理员身份运行vscode终端输入以下指令

get-ExecutionPolicy
set-ExecutionPolicy RemoteSigned
get-ExecutionPolicy
vue -V

3. 创建vue项目
demo为vue项目名,终端输入命令:

vue init webpack demo

若出现:
在这里插入图片描述
按照提示输入neo4j_echarts>npm i -g @vue/cli-init
然后重新输入vue init webpack demo
出现以下选项,直接输入enter即可
在这里插入图片描述

出现以下提示:
在这里插入图片描述

输入以上两个命令,最后结果在这里插入图片描述

点击链接完成项目创建
在这里插入图片描述

四、处理报错

运行vue文件报错

Virtual script not found, may missing <script lang="ts"&gt; / "allowJs": true / jsconfig.json.
解决方法:在项目目录创建 jsconfig.json 配置文件,其中设置allowJs”: true

{
  "compilerOptions": {
    "allowJs": true,
  }
}

原文地址:https://blog.csdn.net/fortune_mz/article/details/129924974

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任

如若转载,请注明出处:http://www.7code.cn/show_34074.html

如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱suwngjj01@126.com进行投诉反馈,一经查实,立即删除

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注