Vue2脚手架配置教程&IDEA配置VUE

已于 2024-01-15 15:13:03 修改
阅读量566 收藏 9
点赞数 8
分类专栏： Java 文章标签： javascript 前端 开发语言
于 2024-01-14 14:50:56 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_45895217/article/details/135583352
版权

5.12.3 Vue Cli 文档地址: https://cli.vuejs.org/zh/
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

IDEA 打开项目，运行项目

在这里插入图片描述
在这里插入图片描述

小菜0-o
关注
  • 8
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
基于SSM+VUE的前后端分离在线考试管理系统项目源码+数据库+项目说明.zip
01-09
【资源说明】 1、该资源包括项目的全部源码，下载可以直接使用！ 2、本项目适合作为计算机、数学、电子信息等专业的课程设计、期末大作业和毕设项目，作为参考资料学习借鉴。 3、本资源作为“参考资料”如果需要实现其他功能，需要能看懂代码，并且热爱钻研，自行调试。 基于SSM+VUE的前后端分离在线考试管理系统项目源码+数据库+项目说明.zip # 简介（有用的话记得给个star哈，谢谢啦） ## 1. 项目描述 1. 此项目为一个基于Vue的前后端分离的在线考试系统项目 2. 使用了 Vue 全家桶+ES5ES6ES7+Webpack 等前端新技术 3. 后端基于SpringBoot搭建SSM框架 4. 包括学生端、教师端和管理员端 5. 采用模块化、组件化、工程化的模式开发 6. 教师端和管理员端基于[vue-element-admin模板](https://github.com/PanJiaChen/vue-element-admin) ## 2. 能从此项目中学到什么? ### 2.1 项目开发流程及开发方法 1. 熟悉一个项目的开发流程 2. 学会组件化、模块化、工程化的开发模式 3. 掌握使用 vue-cli 脚手架初始化 Vue.js 项目 4. 学会模拟 json 后端数据，实现前后端分离开发 5. 学会 ES5ES6ES7+eslint 的开发方式 6. 掌握一些项目优化技巧 7. 掌握WebSocket实时在线通信 ### 2.2 Vue 插件或第三方库 1. 学会使用 vue-router 开发单页应用 2. 学会使用 axios/vue-resource 与后端进行数据交互 3. 学会使用 vuex 管理应用组件状态 4. 学会使用 基于Vue的插件， 如vue-seamless-scroll实现无缝滚动，v-viewer实现图片预览，ly-tab实现触摸滑动并具有回弹效果等 5. 学会使用 mint-ui、muse-ui和element-ui 组件库构建界面 6. 学会使用 mockjs 模拟后台数据接口 7. 学会通过API接口与后端进行交互 8. 学会通过第三方平台七牛云进行图片的存取 ## 3. 运行项目 **onlineexam-system-backend文件夹：** 1. 导入onlineexam.sql数据库文件，并修改src/main/resources/application.properties配置文件连接MySQL数据库正确的用户名和密码 2. 在IntelliJ IDEA中运行OesApplication启动类 ## 4. 其他项目地址 [在线考试系统学生端](https://github.com/FrontDemon/onlineexam-student) [在线考试系统教师端](https://github.com/FrontDemon/onlineexam-teacher) [在线考试系统管理员端](https://github.com/FrontDemon/onlineexam-admin)
White-Jotter-Vue:白笔记本的前端
03-08
这是一个简单的前初步分离项目，主要采用Vue.js + SpringBoot技术栈开发。 除了使用入门练习，我还希望该项目可以作为一些常见的Web项目的脚手架，帮助大家简化构建网站的流程。之所以叫白卷，是因为它从0开始，会随着时间的逐步完善。 前端地址： : 初步地址： : 欢迎加入微信圈子【开发者】分享，讨论学习经验： 感谢JetBrains提供全家桶开源许可，IDEA确实是Java领域最好用的IDE。 整体效果 1.首页 作为展示页面，包括开发这个项目的主要参考资料，近期更新和 2.图书馆 提供图书信息展示功能 3.笔记本 提供笔记，博文展示功能 4.后台管理 包含仪表板，内容管理，用户及权限管理等 技术栈 1.前端技术栈 1.Vue 2.ElementUI 3.轴 2.初步技术栈 1，Sprint Boot2，Spring Data + JPA 3，MySQL 4，四郎 部署
详解vue项目的构建，打包，发布全过程
11-27
很多朋友对于VUE项目的一系列流程不熟悉，小编根据网友提出的问题，整理了关于vue项目的构建打包发布全过程，希望对你有用。 一、vue项目的创建 1、首先第一肯定是要有Node.js及npm这个不多说了 2、安装脚手架 此时可以直接浏览-但是现在肯定有很多小白想将他发布到gitHub上并可以浏览，使用vue全家桶制作自己的博客。 现在就有我来说说如何讲vue项目发布到github上 之前写过vue环境搭建 可以参考： vue环境搭建 二、vue项目的打包 1、大家都知道使用npm run build进行打包，这个时候你直接打开dist/下的index.html,会发现文件可以打开，但是
idea vue 修改创建模板，快速创建vue2 vue3 模板
丿灬安之若死
01-08 1281
原先内容比较适合vue2。可以稍作升级到vue3。
idea创建vue项目（包含两个常见错误，看过不亏哦）
ololol456的博客
11-23 2796
创建vue项目（包含两个常见错误），记录学习
IDEA安装vue,并搭建vue后台管理系统
weixin_45281571的博客
09-06 2777
IDEA安装vue,并搭建vue后台管理系统 第一次写，虽然比较菜，真实可用。 一 .安装node.js 1、下载安装包 Node.js 官方网站下载：https://nodejs.org/en/ 选择操作系统对应的包： 2、安装 打开安装，傻瓜式下一步即可： 选择安装位置，我这里装在D盘下： 一直点next 点finish 打开cmd命令 检查node.j...
Vue2 脚手架下载及配置淘宝镜像--和ieda的配置和打开
业精于勤，荒于嬉
04-27 2809
1. 搭建 Vue2 脚手架工程，需要使用到 NPM(node package manager), npm 是随 nodejs 安装的一款包管理工具, 类似 Maven。2. 为了更好兼容 ，这里我们安装 node.js10.16.3， (因为这里是演示 Vue 脚手架工程),后面我们还会讲解 Vue3 的脚手架工程搭建, 再对 Node 升级.8-安装 webpack 和 webpack-cli , 指令: npm install [email protected] webpack-cli -D。
vue.js2.0学习笔记:搭建开发环境、构建项目、idea运行vue
qq_33703308的博客
05-29 378
笔记目录搭建开发环境安装node安装npm安装vue-cli构建项目新建项目安装依赖尝试运行导入idea运行功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 搭建开发环境 安装node Node.js官网： 进入Node.js官网
SpringBoot+Vue 02--idea环境配置+结构介绍
AMWICD的博客
04-18 830
idea配置 点击启动后自动打开网页 结果在自动打开的网页中出现了“网页无法访问”的问题。 能自动打开网页就说明open起作用了 解决方法： 修改serve.js文件中的地址 src结构： 路由：通过路径访问页面 安装vue.js插件 安装element组件 npm install element-plus --save ...
Vue安装以及在IDEA里配置Vue
Zero .
08-31 154
刚来公司实习发现公司的前端使用的是vue，之前根本就没有听说过。然后一上来就需要看代码，but but 就是没有文档什么的东西， 就需要自己去研读，我就想去运行其中的前端和后端联调起来方便理解，结果在配置和运行中出现了很多挫折，我就想写一下方便 大家不去采坑，直接运行好 一、在IDEA中配置vue插件 点击File-->Settings-->Plugins-->搜索vue...
解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题
01-21
以上所述是小编给大家介绍的解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题,希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对软件开发网网站...
Vite + Vue3 + ts 注册登录页面书写 搭配Nodejs + Express + postgresql接口
04-10
Vite + Vue3 + ts 注册登录页面书写 搭配Nodejs...一个vue包 vite+vue3+ts+eleplus 配置了router vuex axios postcss-px-to-viewport界面自适应 env prod环境等 启动:均是 npm i npm start 仅供学习哈 也在慢慢完善中
使用IDEA创建一个简单的Vue项目
qq_43609574的博客
07-16 1737
使用IDEA创建一个简单的Vue项目Vue项目的创建使用的软件及库版本情况开始新建一个Vue项目运行 Vue项目的创建 使用的软件及库版本情况 可在命令行进行版本查看 IDEA 2020.3.2 node.js 10.15.1 npm 6.4.1 vue 2.9.6 vue-cli 4.5.13 开始 新建一个Vue项目 项目类型选择JavaScript–>Vue.js 项目命名（不能有大写字母） 等待项目资源下载完毕后（过程中有一次需要输入Y）的项目目录结构图如下 运行 打开浏览器访问8
《Vue》——从新电脑开始搭建一个已有Vue2项目的环境
XRT_knives的博客
11-19 295
《Vue》——从新电脑开始搭建一个已有Vue2项目的环境
使用idea工具配置和运行vue项目
LMGD的博客
10-16 1363
一、在IDEA中配置vue插件 点击File-->Settings-->Plugins-->搜索vue.js插件进行安装，下面的图中我已经安装好了。 二、搭建node.js环境 安装node.js 可以去官网下载：安装过程就很简单，直接下一步就行 测试是否安装成功：要使用管理员方式打开命令行cmd 安装完成之后，打开命令行工具,输入node -v如果出现版本号，则说明安装成功，npm包管理器是集成在node中的，所以，直接 输入npm -v 就会显示npm版本信
使用Vue-cli 2.x搭建vue项目并在IDEA中配置的详细过程
huangjhai的博客
02-04 1464
文章目录一、搭建Node.js环境二、设置npm下载地址三、安装vue-cli 2.x四、构建项目五、运行项目六、IDEA中配置vue 今天第一次接触到了SPA——单页面应用的开发。并使用Vue进行开发SPA。下面记录这次学习到的vue项目创建过程。 一、搭建Node.js环境 Node.js可以直接去官网下载：https://nodejs.org/zh-cn/。推荐下载长期支持版 安装完成后，...
新建一个vue2.x项目（idea目前默认创建vue3.x项目）
qq_51476492的博客
06-02 2238
vue ui创建vue2.x项目
创建Vue2.0项目并且使用Idea开发工具打开
weixin_41996632的博客
11-05 8110
首先在https://nodejs.org/zh-cn/download/下载安装和配置node.js,查看安装情况，显示版本号说明安装成功 node -v // 查看node版本 npm -v // 查看vue版本 然后安装淘宝镜像 npm i -g cnpm --registry=https://registry.npm.taobao.org 安装脚vue脚手架 cn...
Babel 原理浅析
最新发布
qq_39454432的博客
04-29 813
Babel 原理浅析
idea创建vue2项目
06-07
好的，以下是创建 Vue2 项目的步骤： 1. 打开 IntelliJ IDEA，选择 File -> New -> Project。 2. 在左侧的选项卡中选择“Vue.js”，然后选择“Vue.js”项目类型。 3. 输入项目名称和项目存储路径，然后点击下一步。 4. 在项目设置中，选择“Vue 2.x”版本，然后点击完成。 5. IDEA 会自动创建项目结构和默认的 Vue2 模板。在左侧的项目窗口中，可以看到项目的目录结构。 6. 在 src 目录下创建一个新的 Vue 组件，可以使用以下命令： ``` <template> <div> <h1>Hello, Vue2!</h1> </div> </template> <script> export default { name: 'App' } </script> <style> </style> ``` 7. 在 main.js 中引入并注册该组件： ``` import Vue from 'vue' import App from './App.vue' new Vue({ render: h => h(App), }).$mount('#app') ``` 8. 运行项目，在 IDEA 的顶部菜单栏中选择“Run” -> “Run…”，或者使用快捷键“Shift+F10”。 以上就是在 IntelliJ IDEA 中创建 Vue2 项目的步骤，希望能对你有所帮助。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值