使用vue-cli+webpack搭建vue开发环境

使用vue-cli+webpack搭建vue开发环境

在这里我们需要首先下载node，因为我们要用到npm（cnpm）包下载，是基于node.js的。附node.js下载地址官网地址(https://nodejs.org/en/) 之后就在本机电脑打开命令提示符窗口（开始–搜索–输入cmd–回车）直接输入node -v查看node.js的版本 没问题之后开始下载webpack； 输入npm（cnpm）install webpack -g（cnpm淘宝命令快速–install下载的意思–webpack-g全局下载）附淘宝npm镜像使用方法【同代码爱好者记录】(https://blog.csdn.net/quuqu/article/details/64121812) 开始全局安装vue-cli(vue脚手架) npm(cnpm) install vue-cli -g 回车 然后输入vue -v 查看vue版本没问题 开始输入 vue init webpack (webpack-simple小型项目使用) 随便一个项目名{vue init webpack vue-app}（init初始化webpack）webpack-simple搭建，因为它没有严格的规范，相对于大多数程序员来说比较好 注释一下（在命令符中输入cnpm info vue-cli查看vue-cli历史版本） 上面接着说（下载完之后会出现）一些提示的cd vue-app和npm run dev 按着这个输入就行 然后等着100%完成之后会出现
在谷歌搜索中输入localhost:8080回车就能出来（如果不行就写全localhost:8080/app-vue你的那个文件夹名） 此时就基本可以使用了，但是有个问题，鼠标右键点击检查在connsole里面会有一大堆的警告（怎么处理呢） 首先为什么会出现这些个警告呢（这里其实是因为eslint）
【 eslint是js中目前比较流行的插件化的静态代码检测工具。通过使用它可以保证高质量的代码，尽量减少和提早发现一些错误。使用eslint可以在工程中保证一致的代码风格，特别是当工程变得越来越大、越来越多的人参与进来时，需要加强一些最佳实践。】 找到自己的那个文件夹打开 在里面找到built文件夹打开找到图中红线所标处 然后在当前js文件中找到红线部分注释掉 最后在命令符中重启 npm run dev 等待100% 浏览器刷新一下页面就好了，那些警告就会消失。 最后就可以使用当前的webpack+vue搭建的环境了。