vue-cli脚手架的使用

安装:

npm install -g vue-cli

用法: vue init <template-name> <project-name>
如果不写项目名,则默认当前文件夹作为项目名
举例:

vue init webpack my-project

目前可用的模块包括
·webpack - 一个功能齐全的webpack+vue-loader设置,具有热重载,linting,测试和css提取功能
·webpack-simple - 一个简单的webpack+vue-loader设置,用于快速原型设计
·browserify - 全功能Browserify+vueify设置用热重载载,linting&单元测试。
·browserify-simple - 一个简单的Browserify+vueify设置,用于快速原型设计
·pwa - 基于webpack模板的vue-cli的PWA模板
·simple - 单个HTML文件中最简单的vue设置

webpack模板构建演示

关于vue的框架、库和好的资源

相关文件和文件夹的含义

project
--build   webpack相关配置文件(都已配置好,一般不用再进行配置)
----build.js 配置文件
----check-vensions.js 检测npm node等的版本
----vue-loader.conf.js 关于css-loader的加载
----utils.js 一些工具文件
----webpack.base.conf.js webpack的主要文件
----webpack.dev.conf.js 开发环境配置
----webpack.prod.conf.js 生产环境配置
--config vue基本配置文件(我们可以配置监听端口,打包输出等)
----dev.env.js 环境文件
----index.js
----prod.env.js
--node_modules 依赖模块包
--src  核心项目文件(我们洗的代码都放在这个文件夹下)
----assets 静态资源(样式类文件,如css less sass,以及一些外部的js文件)
----components 公共组件
----router 路由(配置项目路由)
----App.vue 根组件
----main.js 入口文件
--static 静态资源(一般放图片类资源)
--.babelrc babel的配置文件 编译参数
--.editorconfig 代码编辑器配置文件
--.gitignore 忽略config配置文件,如果放到GitHub上忽略node_modules(模块包)等配置文件
--.postcssrc.js css配置文件,对css前缀补充等
--index.html 
--package.json
--
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 参考了这篇博客成功搭建了vue项目框架。https://www.cnblogs.com/wisewrong/p/6...
    温梦丽阅读 1,924评论 0 0
  • 上次使用vue+node搭建简易博客过程中,发现自己还有很多的问题需要学习,于是就有了这一系列关于vue的笔记。 ...
    前端守望者阅读 2,578评论 0 1
  • 个人基于对 Vuejs 的学习制作了一个 Todo 单页应用 Lightodo,功能包括:添加待办事项卡片,对卡片...
    AlessiaLi阅读 21,655评论 16 308
  • 写文章[https://www.jianshu.com/writer#/]注册[https://www.jians...
    过场_ab79阅读 2,481评论 1 1
  • 水流到这里才大彻大悟 目环视这里才大慈大悲 山横在这里才立地成佛 眼中盈满圣水 圣水泡着青山 望你一眼 目光也想打...
    飞刀小剑阅读 877评论 0 4