• node_modules:是安装node后用来存放用包管理工具下载安装的包的文件夹;

  • public文件夹:一般放置一些静态的资源(图片),需要注意的是放在public文件中的静态资源webpack进行打包的时候,会原封不动的打包到dist文件夹中;

  • public/index.html:是一个模板文件,作用是生成项目的入口文件,webpack打包的js,css也会自动注入到该页面中;

  • src文件夹:我们存放各种vue文件的地方;

  • src/assets:用于存放各种静态文件,如图片等;

  • src/compnents:一般放置的是非路由组件(全局组件);

  • src/router:放置路由设置文件,指定路由对应的组件;

  • src/store:放置 vuex 需要的状态关联文件,设置公共的 state、mutations 等;

  • src/views:用于存放我们写好的各种页面,如login、main等;

  • App.vue: 入口组件,pages 里的组件会被插入此组件中,此组件再插入 index.html 文件里,形成单页面应用;

  • src/main.js: 入口文件,主要作用是初始化vue实例,同时可以在此文件中引用某些组件库或者全局挂在一些变量,程序入口文件也就是整个程序中最先执行的文件;

  • .browserslistrc文件:

    该文件只要是 配置兼容浏览器

    对于部分配置参数做一些解释:
    " >1%" :代表着全球超过1%人使用的浏览器
    “last 2 versions” : 表示所有浏览器兼容到最后两个版本
    “not ie <=8” :表示IE浏览器版本大于8(实则用npx browserslist 跑出来不包含IE9 )
    “safari >=7”:表示safari浏览器版本大于等于7

  • .gitignore文件:可以避免在提交代码时把我们不想上传的文件提交到git中

  • bable.config.js文件:bable(bable配置相关的文件);

  • jsconfig.json文件:主要用来配置一个默认根路径,以后可以通过该根路径快速访问到子路径

  • package-lock.josn文件:缓存文件,记录着package.json中第三方库的来源;

  • package.json文件:包管理工具,记录着项目使用的第三方库;

  • README.md文件:md文件一般出现在项目的根目录下面,其作用是:对项目的主要信息进行描述。如果一个项目你很长时间都没有动,突然你需要修改这个项目,那么通过README.md中对项目的描述能让你快速的再次上手;或者别人拿到你的项目也能通过README.md文件的描述快速的了解该项目。

  • vue.config.js文件:vue.config.js(相当于之前的webpack.config.js) 是一个可选的配置文件,如果项目的 (和package.json同级的) 根目录中存在这个文件,那么它会被@vue/cli-service自动加载。你也可以使用package.json中的vue字段,但是注意这种写法需要你严格遵照 JSON 的格式来写。

总结:

以上就是今天要讲的内容,本文简单介绍了vue中目录放什么。

Logo

前往低代码交流专区

更多推荐