ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

VSCode 开发Vue + ElementUI

2022-01-20 23:33:07  阅读:58  来源: 互联网

标签:npm 插件 vue cli ElementUI VSCode Vue


开发环境

VSCode
Node.js
vue-cli
Vue3.X
安装好node.js并配置好环境,然后用npm安装vue cli(npm install -g @vue/cli)。

VSCode安装Vue开发用插件

中文语言包:Chinese (Simplified) Language Pack for Visual Studio Code
VUE插件:Vetur
Vue模板语言插件(快速生成vue代码块):Vue VSCode Snippets
VS目录文件夹图标:vscode-icons

VSCode 通过Vue-cli 模板创建项目

打开VSCode,打开终端,进入到目录:D:\VScodeWorkspace,输入vue create hello-world :
image
image
image
cd hello-world,执行 npm run serve启动
image

引入ElementUI

vue add element-ui
npm install vue-cli-plugin-element-plus

image

遇到的问题

vue : 无法将“vue”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,请确保路径正确,然后再试一次

cmd窗口可以运行vue命令,但是终端窗口就不行,需要把终端删除掉新建一个终端即可。
image

vue : 无法加载文件 D:\XXX\node-v16.13.2-win-x64\node_global\vue.ps1,因为在此系统上禁止运行脚本

原因:首次在计算机上启动 Windows PowerShell 时,现用执行策略很可能是 Restricted(默认设置,Get-ExecutionPolicy查看状态)。Restricted 策略不允许任何脚本运行,防止执行不信任的脚本。
解决办法:
以管理员身份运行vscode,输入命令
set-executionpolicy remotesigned
image

标签:npm,插件,vue,cli,ElementUI,VSCode,Vue
来源: https://www.cnblogs.com/aeolian/p/15828543.html

专注分享技术,共同学习,共同进步。侵权联系[admin#icode9.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有