node
npm
npm管理项目
npm init -y
npm install xxxx@0.0.0
npm uninstall xxx
npm i 下载package.json所有的依赖
webpack
默认的入口文件
手动创建的src/index.js
默认的出口文件
dist/main.js
webpack --mode development/production
vue-cli
脚手架帮助我们搭建Vue项目的
下载
npm i vue-cli -g
用vue-cli搭建项目
vue init webpack 项目名称
启动项目
cd 项目目录下
npm run dev
vue-cli项目目录
build 打包后存放的所有文件包括配置文件
config 配置文件
node_models 依赖包
src 工作目录
static 静态文件
index.html 单页面应用
package.json 存放所有项目信息
路由的解耦
-- 下载 npm i vue-router
-- 导入 import VueRouter from "vue-router"
-- Vue.use(VueRouter)
-- 定义匹配规则url
-- 实例化VueRouter
-- 把VueRouter对象注册到Vue的根实例里

Vue第六篇 element-ui 项目管理工具npm webpack 启Vue项目vue-cli的更多相关文章

  1. vue中的swiper element ui

    欢迎加入前端交流群交流知识&&获取视频资料:749539640 很多同学问,怎么把swiper引入到vue的脚手架里去,之前的一篇博客有提到怎么引入,但是后来感觉不怎么好,还是用一些v ...

  2. Laravel 6.X + Vue.js 2.X + Element UI +vue-router 配置

    Laravel 版本:6.X Vue 版本:2.X Laravel配置: Laravel使用的是Laragon安装 选择Laravel:接下来弹出框,输入项目名,laravel会自动创建一个数据库,数 ...

  3. vue中,使用element ui的弹窗与echarts之间的问题

    今天项目中有个需求,就是在页面中点击一个图标,弹出一个抽屉式的弹窗(弹窗是element UI的抽屉),弹窗里边是echarts呈现的数据,当我直接用echarts的时候,报错dom没有获取到: 这就 ...

  4. vue问题三:element ui的upload组件上传图片成功和移除事件

    element ui的upload组件上传图片成功和移除事件: 登录后获取到后台传的token存到中: sessionStorage.setItem("token",data.ob ...

  5. 第四十六篇:工程化概念以及什么是webpack

    好家伙,这波是概念补充 1.什么是工程化概念? 我的开发: 开个项目,想怎么改怎么改,拉个东西过来就用 实际的前端开发: (1) 模块化(js的模块化,css的模块化,资源的模块化) (2) 组件化( ...

  6. node搭环境(四)--webpack启服务运行VUE模块文件(手写简单脚手架)

    webpack启服务步骤: 1.新建空文件夹webpack-vue.在空文件夹右键点击- GIt Bath here--输入cnpm init--按程序走完会生成package.json文件 2.打开 ...

  7. webpack 4.x 解决 webpack-dev-server工具在webpack构建的项目中使用问题

    webpack-dev-server工具能实现自动打包编译和热更新 首先将webpack-dev-server安装到项目中 npm install webpack-dev-server -D 这时在命 ...

  8. vue按需引入Element UI的方法

    在我们的实际项目开发中,多数是采用按需引入的模式来进行开发的,那么具体应该如何操作呢,可能会有许多新人傻傻分不清楚,具体将在下文讲到. 首先我们先vue create demo创建一个项目出来此时我们 ...

  9. element UI 下拉菜单滚动监听(vue指令)

    直接看代码吧,可以直接粘贴此代码到你的编辑器中看效果. <template> <div class="page-component"> <div cl ...

  10. Java-集合第六篇操作集合的工具类Collections

    1.Java提供了一个操作Set.List.Map等集合的工具类:Collections. 工具类中提供的方法主要针对Set.List.Map的排序.查询.修改等操作,以及将集合对象设置为不可变.对集 ...

随机推荐

  1. C++ Qt开发:SpinBox数值微调框组件

    Qt 是一个跨平台C++图形界面开发库,利用Qt可以快速开发跨平台窗体应用程序,在Qt中我们可以通过拖拽的方式将不同组件放到指定的位置,实现图形化开发极大的方便了开发效率,本章将重点介绍QSpinBo ...

  2. easycom自动导入自定义组件

    使用时要先创建一个这样的结构 相当于定义一个方法,所有的页面引用就可以了

  3. 如何基于 k8s做私有化部署

    公众号「架构成长指南」,专注于生产实践.云原生.分布式系统.大数据技术分享. 随着国内数字化转型的加速和国产化进程推动,软件系统的私有化部署已经成为非常热门的话题,因为私有化部署赋予了企业更大的灵活和 ...

  4. LeetCode456:132模式(单调栈)

    解题思路:根据题意,我们首先首先要找到所有的极大值点,同时记录当前极大值点的左边的最小值.遍历所有点,看是否能够满足132条件.虽然记录极大值点的地方可以优化,减小比较的次数,但是由于我们不知道极大值 ...

  5. C++ Qt开发:StringListModel字符串列表映射组件

    Qt 是一个跨平台C++图形界面开发库,利用Qt可以快速开发跨平台窗体应用程序,在Qt中我们可以通过拖拽的方式将不同组件放到指定的位置,实现图形化开发极大的方便了开发效率,本章将重点介绍QString ...

  6. JavaFx之controlsfx8下载(十七)

    JavaFx之controlsfx8下载(十七) controlsfx是JavaFx功能的扩展补充,这里我使用java8,我将源码下载下来并编译好jar,在java8的环境双击运行runSamples ...

  7. JPA object references an unsaved transient instance - save the transient instance before flushing

    nested exception is org.springframework.dao.InvalidDataAccessApiUsageException: org.hibernate.Transi ...

  8. Go语言实现GoF设计模式:备忘录模式的实践探索

    本文分享自华为云社区<[Go实现]实践GoF的23种设计模式:备忘录模式>,作者:元闰子. 简介 相对于代理模式.工厂模式等设计模式,备忘录模式(Memento)在我们日常开发中出镜率并不 ...

  9. 一图看懂CodeArts Release三大特性

    本文分享自华为云社区<一图看懂CodeArts Release三大特性,带你玩转发布管理服务>,作者:华为云PaaS服务小智. 华为云发布管理服务Codearts Release,是面向开 ...

  10. 能够让机器狗学会灭火, ModelArts3.0让AI离我们又近一步

    摘要:训练.标注成本节省90%!华为云自动化AI开发平台ModelArts 3.0发布,从训练数据到模型落地一站式打通. 今年的华为,着实遭遇了不小的困难. 尤其是供应链,包括芯片方面的打击,让华为轮 ...