Element & 8080端口被占用

Element

    • Element官网:
      • layout 布局:
      • Form表单:
      • Card 卡片:
      • Container 布局容器:
      • NavMenu 导航菜单:
      • Table 表格:
      • MessageBox 弹框:
    • 复制vue子项目文件粘贴到新的项目文件夹(组建新的项目):
      • 加载项目:
      • 运行项目:
    • 注意:关于前后端分离项目,8080端口被占用的问题:
      • 参考:解决8080端口被占用问题—方便—>解决idea运行异常:8080端口被占用。
    • Error:Failed to compile.
      • 解决:在项目“查看”—“终端”中输入:“ npm i element-ui -S ”安装==整个==的element-ui组件。
    • 参考:

Element官网:

Elementhttps://element.eleme.cn/#/zh-CN/
Element & 8080端口被占用_第1张图片

layout 布局:

Element & 8080端口被占用_第2张图片

Form表单:

Element & 8080端口被占用_第3张图片

Card 卡片:

Element & 8080端口被占用_第4张图片

Container 布局容器:

Element & 8080端口被占用_第5张图片

NavMenu 导航菜单:

Element & 8080端口被占用_第6张图片

Table 表格:

Element & 8080端口被占用_第7张图片

MessageBox 弹框:

Element & 8080端口被占用_第8张图片

复制vue子项目文件粘贴到新的项目文件夹(组建新的项目):

选中项目文件中的子级文件(除了“node_modules”),ctrl+c进行复制。
Element & 8080端口被占用_第9张图片
新建空项目文件夹0928_ElementUI_ssm_vue_KTLX,新建内部空文件夹web_front_0928,ctrl+v复制的文件粘贴到文件中。
Element & 8080端口被占用_第10张图片
将项目文件拖拽到vscode中打开:
Element & 8080端口被占用_第11张图片
点击“查看”—“终端”,输入命令" npm install "+“ 回车键 ”进行加载项目,生成“node_modules”文件。
Element & 8080端口被占用_第12张图片
Element & 8080端口被占用_第13张图片

加载项目:

Element & 8080端口被占用_第14张图片

运行项目:

Element & 8080端口被占用_第15张图片
将生成的项目链接地址复制到浏览器地址栏,回车:
Element & 8080端口被占用_第16张图片

注意:关于前后端分离项目,8080端口被占用的问题:

注意:运行前后端分离的项目时,应该先运行后端(占用8080端口),在运行前端(占用8080端口,如果8080端口被占用,将占用其他闲置的端口)。
故:运行前后端分离项目时,先运行后端,在运行前端。

在这里插入图片描述

参考:解决8080端口被占用问题—方便—>解决idea运行异常:8080端口被占用。

解决8080端口被占用问题https://blog.csdn.net/qq_43822489/article/details/124515596

Error:Failed to compile.

./src/main.js
Module not found: Error: Can’t resolve ‘element-ui’ in ‘D:\java-Vue-space\0928_ElementUI_ssm_vue_KTLX\web_front_0928\src’

Element & 8080端口被占用_第17张图片
Element & 8080端口被占用_第18张图片

解决:在项目“查看”—“终端”中输入:“ npm i element-ui -S ”安装整个的element-ui组件。

Element & 8080端口被占用_第19张图片

Element & 8080端口被占用_第20张图片
Element & 8080端口被占用_第21张图片

参考:

Element & 8080端口被占用_第22张图片

Element & 8080端口被占用_第23张图片

你可能感兴趣的:(#,Vue,vue.js,javascript,前端)