1.Nodejs安装和淘宝镜像安装下载网址：https://nodejs.org/en/（直接进入next）查看node版本node-v永久使用淘宝镜像命令:npmconfigsetregistryhttps://registry.npm.taobao.org2.安装使用vue-devtoolsvue-devtools是一个基于chrome浏览器的vue应用调试插件，可以大大提高我们的调试效率。接下来介绍vue-devtools的安装。(1)直接从chromestore安装vue-devtools可以直接从chromestore下载安装(2)手动安装①找到vue-devtools的github项目clone到本地。vue-devtoolsgitclonehttps://github.com/vuejs/vue-devtools.git②安装项目需要的npm包npminstall③编译项目文件npmrunbuild④添加到chrome浏览器浏览器输入地址“chrome://extensions/”进入扩展页面，点击“LoadthedecompressedExtensions...”按钮，选择vue-devtools>shells下的chrome文件夹。如果您没有看到“加载解压的扩展...”按钮，您需要检查“开发者模式”。3.vue-cli的安装与使用（一）安装vue-clinpminstall@vue/cli-g（二）创建项目vuecreate<项目名>``//文件名不支持驼峰（包括大写字母）具体操作如下：1、选择一个预设（preset）①除了最后两个选项，其他选项都是你之前保存的预设配置（下图中第一个“my-default”就是之前保存的预设配置，nowyoucan可以直接使用）②如果没有保存过配置，只有下面两个选项：default(babel,eslint):默认设置（直接回车）适合快速创建新项目的原型,没有任何辅助功能npmpackage手动选择功能：自定义配置（按方向键↓）是我们需要的面向生产的项目，一个提供可选功能的npm包2.自定义配置需要选择你需要的配置项？查看你的项目需要的特性：>()Babel//Transcoder，可以将ES6代码转成ES5代码，使其可以在现有环境中执行。()TypeScript//TypeScript是JavaScript（后缀.js）的超集（后缀.ts），包含并扩展了JavaScript的语法。它需要被编译并输出为JavaScript才能在浏览器中运行。目前很少有人使用()ProgressiveWebApp(PWA)Support//ProgressiveWebApplication()Router//vue-router（vue路由）()Vuex//vuex（vue的状态管理模式）()CSSPre-processors//CSS预处理器(eg:less,sass,stylus)()Linter/Formatter//代码风格检查和格式化(eg:ESlint)()UnitTesting//单元测试(unittests)()E2ETesting//e2e(endtoend)测试3.选择对应功能的具体工具包①是否使用historyrouterVue-Router利用浏览器自身的hash模式和history模式的特点实现前端路由（通过调用浏览器提供的接口)②css预处理器主要是解决浏览器对css的兼容性，简化css代码等③ESLint：提供插件式javascript代码检测工具，ESLint+Prettier//用的比较多④Whentodetect:保存或提交链接检查时单元测试？选择一个单元测试解决方案：（使用方向键）Mocha+Chai//mocha很灵活，只提供了一个简单的测试结构。如果需要其他功能，需要添加其他库/插件来完成。全局环境必须安装>Jest//安装配置简单，使用方便。使用内置的Istanbul，您可以查看测试覆盖率。与Mocha相比：配置简单，测试代码简单，易于与babel集成，内置丰富的expect⑤如何存储配置：⑥是否保存这个配置（y：记录这个配置，然后需要命名；n：做不记录此配置)⑦构建完成：按照提示启动项目(3)可视化项目vueui4.目录结构|--src//源码目录||--组件//vue公共组件||--router//vue的路由管理||--App.vue//页面入口文件||--main.js//程序入口文件，加载各种公共组件|--public//静态文件，比如一些图片，json数据等||--favicon.ico//图标文件||--index.html//入口页面|--vue.config.js//是一个可选的配置文件，包括大部分vue项目配置|--.babelrc//ES6语法编译配置|--.editorconfig//定义代码格式|--.gitignore//git上传需要忽略的文件格式|--.postcsssrc//postcss配置文件|--README.md//项目说明|--package.json//项目基本信息，包依赖信息等。在根目录下新建vue.config.js，自己配置，eg：（简单配置，更多配置详情请参考官网：https://cli.vuejs.org/zh/config/)module.exports={baseUrl:'/',//部署应用时的根路径（默认'/'），也可以使用相对路径（有使用限制）outputDir:'dist',//运行时生成的生产环境构建文件的目录（默认''dist''，构建前会清空）assetsDir:'',//放置生成的静态资源（s,css,img,fonts)目录（相对于outputDir）（默认''）indexPath:'index.html',//参考生成的index.html的输出路径（相对于outputDir）也可以是绝对路径pages:{//pages中配置的路径和文件名必须存在于你的文档目录中，否则启动服务时会报错',//页面入口，每个“页面”应该有对应的JavaScript入口文件title:'IndexPage',//使用title选项时，在模板中使用：
