当前位置: 首页 > 后端技术 > Node.js

Vue进阶1-1——项目搭建(vue-cli)

时间:2023-04-03 11:29:21 Node.js

1.安装Nodejs点击https://nodejs.org/en/download/下载安装node。安装成功后,在终端输入npm-v,会显示npm的版本信息。2.安装淘宝镜像npm是nodejs的包管理工具。为了加快下载速度,可以安装淘宝镜像。安装成功后,就可以使用cnpm代替npm了。在终端输入npminstall-gcnpm--registry=https://registry.npm.taobao.org3.安装vue-cli全局安装vue-cli。在终端输入npminstall-gvue-cli/cnpmi-gvue-cli。安装成功后可以使用vue-V查看vue的版本。4.创建vue项目使用脚手架创建项目:vueinitwebpackvue-demovue-demo是项目名AppledeMacBook-Pro-3:~apple$vueinitwebpackvue-demo?项目名称vue-demo//(项目名称):Enter?项目描述一个Vue.js项目//(项目介绍):进入?Authorcrr//(Authorname):作者姓名?vuebuildstandalone//(是否安装编译器):回车?安装vue-router?是//(是否安装Vue路由):回车?使用ESLint来检查你的代码?否//(是否使用ESLint检查js代码):n?设置单元测试No//(安装单元测试工具):n?使用Nightwatch设置端到端测试?否//(是否安装端到端测试工具):n?我们应该在项目创建后为您运行`npminstall`吗?(推荐)npm//(推荐):returnCar5.启动项目进入项目目录:cdvue-demo安装项目需要的依赖:npminstall启动项目:npmrundev注意:Vue.js没有支持IE8及以下IE版本。6.项目结构├──build/#webpack配置文件│└──...├──config/│├──index.js#主项目配置│└──...├──src/│├──main.js#应用入口js文件│├──App.vue#主要应用组件│├──components/#公共组件目录││└──...│└──router/#前端routing││└──...│└──assets/#模块资源(webpack处理后)│└──...├──static/#纯静态资源(直接拷贝)├──.babelrc#babel配置,es6需要babel编译├──.postcssrc.js#postcss配置├──.eslintrc.js#eslint配置├──.editorconfig#编辑器配置├──.gitignore#过滤不需要上传的文件├──指数。html#index.html模板└──package.json#构建脚本和依赖VII.后台管理系统其实就是后台管理系统的一个简单demo。需要的童鞋可以点击链接https://github.com/graycrr参考/vu...