Vue脚手架目录详解

vue脚手架一级目录
一级目录

build:webpack配置文件
config:webpack配置文件
node_modules:安装的依赖包
src:所有的组件都写在里面
static:所有第三方的静态资源存放目录

一级文件

.babelrc:babel的一些配置(比如将es6编译成es5的一些配置)
.editorconfig:编辑器的一些配置(包括编码格式,缩进风格,换行格式)
.gitignore:配置Git仓库忽略的一些文件(不会上传)
.postcssrc.js 配置postcss的文件(主要是css样式兼容性,自动加前缀(autoprefixer))
index.html:入口html文件。
package.json: 项目的一些配置信息(项目的一些具体信息)
package-lock.json就是锁定安装时的包的版本号,并且需要上传到git,以保证其他人在npm install时大家的依赖能保证一致。

package.json依赖详解

autoprefixer:是用于给css3属性自动加属性前缀的
babel系列都是处理语法的
chalk:适用于格式化输出命令行信息的,比如run dev以后的start...
copy-webpack-plugin:在webpack中拷贝文件和文件夹
extract-text-webpack-plugin:为了抽离css样式,防止将样式打包在js中引起页面样式加载错乱的现象
file-loader:操作文件
friendly-errors-webpack-plugin:能够更好在终端看到webapck运行的警告和错误
html-webpack-plugin:插件的基本作用就是生成html文件
node-notifier:来发送桌面消息,包括应用状态改变以及错误信息
optimize-css-assets-webpack-plugin:压缩提取出的css,并解决ExtractTextPlugin分离出的js重复问题(多个文件引入同一css文件)
ora:命令行里自动运行的信息提示
portfinder:可以帮你找出正在运行的进程打开了哪些端口
rimraf:跑shell命令 rm-rf 的工具
semver:是用来对特定的版本号做判断的(check-version.js)中
shelljs:selljs是在node里跑shell命令的工具,比如‘rm -rf’在(check-version.js)中,属于Unix命令
uglifyjs-webpack-plugin:压缩js
webpack:打包工具
webpack-bundle-analyzer:打包优化工具,可得到一个可视化模块大小界面
webpack-dev-server:配合webpack,创建开发环境(启动服务器、监视文件变化、自动编译、刷新浏览器等),提高开发效率
webpack-merge:合并

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1 Webpack 1.1 概念简介 1.1.1 WebPack是什么 1、一个打包工具 2、一个模块加载工具 3...
    Kevin_Junbaozi阅读 11,745评论 0 16
  • 写在前面的话 阅读本文之前,先看下面这个webpack的配置文件,如果每一项你都懂,那本文能带给你的收获也许就比较...
    不忘初心_9a16阅读 8,445评论 0 17
  • 一、webpack的基本概念 webpack 本质上是一个打包工具,它会根据代码的内容解析模块依赖,帮助我们把多个...
    cilla123阅读 5,442评论 0 8
  • 先说好,我没疯,疯的人是我妈妈。 现在是早上5点27分,我憋着一泡尿已经在床上整整躺了三个小时了,这三个小时我一动...
    萧瑟瑟瑟瑟阅读 7,144评论 0 0
  • 我第一次認真的學書法,大概是在國二的時候。 「按、轉、行、收。」 「側、勒、努、趯、策、掠、啄、磔。」 口中默念著...
    灰白書生阅读 3,395评论 4 1