vue-cli3的目录结构

一、简介

1. 本文主要介绍vue cli3创建的项目的目录结构。

二、项目的目录结构

1. vue cli3和vue cli2有一些区别，但是区别不会很多，可以先去看看vue cli2创建项目的目录结构再来看这篇文章：vue cli2创建项目的目录结构。

2. public文件夹：该文件夹可以用来存放静态资源，存放在该文件夹的东西不会被打包影响，而是会原封不动的输出到dist文件夹中，和vue cli2中的static文件夹一样的。

3 .browserslistrc: 该文件是用来对浏览器进行限制的，当es6要转为es5的时候，什么样的浏览器可以进行这种转行呢？这个文件的作用就是来进行这样的限制的，和vue cli2中的.bablerc文件一样的作用(所以vue cli2的目录结构解析还是得先看一下哈)。

4 .babel.config.js: 该文件是babel的配置文件，一般用的不多，只是一般，也有可能会用到。

5 .package.json: 该文件于vue cli2还是有一些不同，比如在DevDevDependencies中会使用@vue/cli-service来帮我们再去管理一些其他依赖，也就是说写了这个玩意，相当于写了之前在vue cli2配置的一些依赖信息。

三、启动vue cli3

1. 执行 npm run serve 可以启动项目，具体的可以去package.json中的scripts查看。

vue-cli3的目录结构相关推荐

[vue] 说下你的vue项目的目录结构，如果是大型项目你该怎么划分结构和划分组件呢？
[vue] 说下你的vue项目的目录结构,如果是大型项目你该怎么划分结构和划分组件呢? views目录存放一级路由的组件,即视图组件 Components目录存放组件 Store存放vuex相关文件 ...
Vue.js教程-Vue项目的目录结构和.vue文件的构成
Vue.js教程-Vue项目的目录结构和.vue文件的构成前言 Vue项目的目录结构(Vue-cli3/4版本) .vue文件的构成 Html区域(template) script区域 export ...
vue项目划分目录结构
1.本地项目文件除了用get clone方法以外还可以用到更简单的命令进行关联 git remote add origin git仓库项目的地址 git push -u ortgin maste 通过 ...
（已解决）IDEA 导入Vue项目没有目录结构的问题
一开始导入Vue项目,发现没有目录结构,没有文件夹. 因此去网上搜了一圈,发现了以下的解决方案: 1.打开FIle下的Project Structure项目结构. 2.在modules下点击+号导入m ...
vue php项目目录结构,vue的项目结构须知
这次给大家带来vue的项目结构须知,vue项目结构须知的注意事项有哪些,下面就是实战案例,一起来看一下. 新建一个项目之后,我们来看一下项目的目录结构几个主要文件的内容 index.html文件(入 ...
Vue项目开发目录结构和引用调用关系
本文精华总结:在项目运行中,main.js作为项目的入口文件,运行中,找到其实例需要挂载的位置,即index.html中,刚开始,index.html的挂载点处的内容会被显示,但是随后就被实例中的组件 ...
vue项目开发目录结构说明
项目根目录名称目录目录文件作用 src app.vue 浏览器全体控制文件,一般不需要修改 _tests_\components - jest单体测试用文件,主要用于配置组件 _tests_/ ...
Vue前端工程目录结构
project-web ├─node_modules 依赖包 ├─dist 编译文件 ├─public 静态资源目录 │ ├─res ...
【Vue】Vue项目开发目录结构和引用调用关系
main.js ->找到index.html中的挂载位置->找到app.vue中的挂载内容原文:https://www.cnblogs.com/chenleideblog/p/10432 ...
vue目录结构及简单的开发介绍
熟悉vue项目的目录结构,在一定程度上能提高我的开发效率及查找文件的速度. 这里比较推荐使用VS code编译器,HBuild-x,webstorm等编译器相比之下逊色不少,用过的就知道有多香. 目录 ...

vue-cli3的目录结构

vue-cli3的目录结构相关推荐

最新文章

热门文章