vue.js实战案例(2):运行vue数据可视化项目的环境部署流程

简介: vue.js实战案例(2):运行vue数据可视化项目的环境部署流程

项目背景

1.node.js和npm的配置也是按照说明一步一步安装;

2.初涉vue项目,对于vue是什么还是懵懂的状态;

3.只是按照个人的学习习惯,先拿别人的案例→配置运行环境→成功运行→修改代码(文本图片)→从头梳理→学习技术手册……

4.本篇文章只是作为新手入门的笔记,在术语的表达和前后因果逻辑上都存在着各种问题,一个目的,就是把项目先跑起来!

5.笔记一部分是运行代码,方便复制;一部分截图过程,方便核对。

新建目录

E:\phpStudy\PHPTutorial\WWW\lockdatav

复制项目

将现有的项目文件复制至lockdatav目录

安装淘宝cpm

npm install -g cnpm --registry=https://registry.npm.taobao.org

因为下一步要执行 npm install 真得太慢了,所以在犯错以后,还是按照前辈们的经验直接使用国内淘宝的镜像吧。

查看cnpm 版本,如果正常显示,表明镜像安装成功,可以直接使用cnpm命令行了。

cnpm -v



安装依赖node_modules

cnpm install



运行服务

npm run server



浏览器输入http://localhost:8080,项目运行起来了(因涉及别人的项目案例,不再截图演示)!


LOCKDATAV DONE!

相关文章
|
10月前
|
JavaScript
Vue中如何实现兄弟组件之间的通信
在Vue中,兄弟组件可通过父组件中转、事件总线、Vuex/Pinia或provide/inject实现通信。小型项目推荐父组件中转或事件总线,大型项目建议使用Pinia等状态管理工具,确保数据流清晰可控,避免内存泄漏。
789 2
|
9月前
|
缓存 JavaScript
vue中的keep-alive问题(2)
vue中的keep-alive问题(2)
662 137
|
人工智能 JavaScript 算法
Vue 中 key 属性的深入解析:改变 key 导致组件销毁与重建
Vue 中 key 属性的深入解析:改变 key 导致组件销毁与重建
1286 0
|
JavaScript UED
用组件懒加载优化Vue应用性能
用组件懒加载优化Vue应用性能
|
人工智能 JSON JavaScript
VTJ.PRO 首发 MasterGo 设计智能识别引擎,秒级生成 Vue 代码
VTJ.PRO发布「AI MasterGo设计稿识别引擎」,成为全球首个支持解析MasterGo原生JSON文件并自动生成Vue组件的AI工具。通过双引擎架构,实现设计到代码全流程自动化,效率提升300%,助力企业降本增效,引领“设计即生产”新时代。
829 1
|
12月前
|
JavaScript 安全
在 Vue 中,如何在回调函数中正确使用 this?
在 Vue 中,如何在回调函数中正确使用 this?
577 0
|
JavaScript 前端开发 UED
Vue 表情包输入组件实现代码及详细开发流程解析
这是一篇关于 Vue 表情包输入组件的使用方法与封装指南的文章。通过安装依赖、全局注册和局部使用,可以快速集成表情包功能到 Vue 项目中。文章还详细介绍了组件的封装实现、高级配置(如自定义表情列表、主题定制、动画效果和懒加载)以及完整集成示例。开发者可根据需求扩展功能,例如 GIF 搜索或自定义表情上传,提升用户体验。资源链接提供进一步学习材料。
870 1
|
JavaScript 前端开发
JavaScript流程控制,带你打印九九乘法表
JavaScript流程控制,带你打印九九乘法表
538 0
JavaScript流程控制,带你打印九九乘法表
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
484 2
|
JavaScript 前端开发
JavaScript中的原型 保姆级文章一文搞懂
本文详细解析了JavaScript中的原型概念,从构造函数、原型对象、`__proto__`属性、`constructor`属性到原型链,层层递进地解释了JavaScript如何通过原型实现继承机制。适合初学者深入理解JS面向对象编程的核心原理。
366 1
JavaScript中的原型 保姆级文章一文搞懂