第一个vue项目——从0到1构建vue（一）

入职学霸君三周，我的第一个大需求，世界杯活动历时两周，刚刚终于上线。这是我第一个实践中的vue项目，也磕磕绊绊的完成了从react的转变。以此为记。

首先记录下菜鸟的学习过程：

（1）看个大概

因为每个活动代码相对独立，我先大致看了一遍几个之前的vue项目，从项目目录结构开始，到样式引用，接口调用方法，页面构建方法，对有用的一些api什么的有个大致的印象；

（2）了解VUE

带着一点懵懂和猜测，我花了一上午的时间过了一遍vue文档，主要是生命周期的使用，页面模版结构，以及跟react的对比，然后跟随文档用vue-cli搭建了我的第一个vue项目，完成 hello vue；

（3）完善基本功能

根据之前的习惯，引入less，实现多页面跳转及页面间数据传递，借用easyMock实现接口调用等；

（4）实现业务

万事具备，就开始干活了，主要策略就是摸着石头过河，研读文档，主要解决生命周期的合理使用，事件的绑定，组件的封装，父子组件的传值等问题，还有一些图片引用一类的问题，因为手生，其实遇到最多的是一些语法的问题，不过文档很清晰，大多也能很快找到答案。

过程比较痛苦，终于也是磕磕绊绊的完成了。还存在很多可以优化的地方，主要是项目结构和逻辑实现的思路上，来日方长。

特别感谢几位同事百忙之中的指导。

此为1，后面有时间就上代码，写写具体操作。

转载于:https://www.cnblogs.com/222tjr-blog/p/9274233.html

第一个vue项目——从0到1构建vue（一）相关推荐

Vue学习笔记：使用CLI构建Vue项目
Vue学习笔记:使用CLI构建Vue项目一.安装Vue CLI 要用到集成在node.js里的npm来安装Vue CLI. 1.下载并安装node.js 2.配置node.js的环境变量 3.启动命 ...
Vue项目部署及使用WebStorm开发Vue
Vue项目部署及使用WebStorm开发Vue Vue项目部署搭建Vue环境新建Vue项目使用WebStorm开发Vue WebStorm相关配置配置路由全局页面App.vue 全局引入组件 ...
创建vue项目+总结使用(跨域问题+vue 创建)
创建vue项目: -安装node.js-vue脚手架-vue create 项目名字pycharm开发vue项目-需要安装vue.js插件-setting--->plugins--->左下 ...
vue项目中的小知识--快捷键-vue插件版本号--vscode插件等
vue项目中的小知识--快捷键等 0 版本号 1 代码片段的获取: 2 vscode中一些常用扩展 3 进入另一个文件夹,返回上一级 4查看Vue的版本和Vue/CLI的版本 5 --save-dev ...
Vue项目全面解析vuecil3/vuecil4的vue.config.js等常用配置
前端变化日新月异,层出不穷,公司原项目使用vuecil2版本开发,elementUI等一系列库版本太低,也脱离世界很久远了,新版本库需要webpack4等环境,而老版本配置起来bug很多,在使用过程中 ...
从零开始的VUE项目–01（前期准备和前台vue搭建）
前端:VUE (2.9.6) (编码工具:Visual Studio Code) 后台:ASP.NET Web API (编码工具:Visual Studio 2019) 数据库:MYSQL (可视化 ...
sonar检测java vue项目_Jenkins集成SonarQube 实现构建项目同时审查代码
软件版本: SonarQube:7.7 Jenkins:2.164.3 一.简介 SonarQube是一个开源的代码质量分析平台,便于管理代码的质量,可检查出项目代码的漏洞和潜在的逻辑问题.同时,它提 ...
webpack 从 0 到 1 构建 vue
前端领域框架百花齐放,各种优秀框架出现(react,Vue,ag)等等框架.为了方便开发者快速开发, 开发对应的 cli 脚手架,来提高产出.然而初中级的前端工程师对项目里的 webpack 封装和配 ...
学习C++：C++进阶（三）CMake基础篇---用一个小型项目了解CMake及环境构建
V1.1 于2022年7月15日第二次修改:添加了比较多的解释图,解读了各类库的CMakelist.txt文件目录第一部分基础篇(Basics) 1.0 本部分主要学什么(Intro) 1.1 ...
Vue项目使用天地图的方法（Vue引入天地图，创建地图实例）
最近项目需要用到天地图,要引入到Vue项目中,鉴于官网没有相关的说明文档,在这里我记录一下我所使用的引入方法,可能不是很好,希望有更好的方法大佬能教一下我. 第一步,在Vue项目文件夹public下的 ...

第一个vue项目——从0到1构建vue（一）

第一个vue项目——从0到1构建vue（一）相关推荐

最新文章

热门文章