Vue-cli

一、安装环境

1.安装Node.js,网上下载(Node.js自带了软件包管理器npm,用npm安装webpack)
2.全局安装webpacknpm install webpack -g,使用命令webpack -v获取当前webpack版本
3.全局安装webpack-cli,npm install webpack webpack-cli -g
4.全局安装vue-cli,3.0对应的新命令为:npm install -g @vue/cliyarn global add @vue/cli,使用命令vue -V(大写的V)vue --version来获取当前vue-cli的版本
(什么是webpack,为什么要使用他:https://www.cnblogs.com/-walker/p/6056529.html

二、创建项目

1.使用命令vue create (项目名称),回车创建
2.第一项默认配置,第二项手动配置

3.若选择手动配置,配置项如下:


分为4项,Babel、Router、Vuex、CSS Pre-processors,分别表示ES6转ES5、路由、数据管理、css预处理器。回车确定。
4.之后询问是否使用Routerhistory模式,选择“是”
5.使用哪种CSS预处理器,我选择了Less
6.之后询问将Babel、PostCSS、ESLint等的配置放在哪里?随便选一个
7.是否作为模板保存,方便以后用?这个随意,花点时间等待,自行创建完毕

三、安装npm包

1.安装axious(功能相当于ajax):npm install axios
2.安装vux:npm install vux --save、 npm install vux-loader --save-dev 、npm install vue-loader@14.2.2 -D(都要安装)
3.创建vue.config.js文件,进行如下配置:

module.exports = {
    baseUrl: './',
    configureWebpack: config => {
      require('vux-loader').merge(config, {
        options: {},
        plugins: ['vux-ui']
      })
    },
  }

四、命令

1.npm run serve:运行项目,出现一个地址(http://localhost:8080)用浏览器访问此网址,即为当前项目,之后无需刷新,保存代码后页面自动更新
2.npm run build:打包项目,自动生成dist文件夹,即为项目最终需要上传的目录
3.Ctrl + C:中断当前指令
4.错误:Error: Watching remote files is not supported.
原因:webpack-dev-server出了问题,这是setupWatchStaticFeature函数在3.7.2和3.8.0之间发生了变化引起的问题
解决办法:npm install webpack-dev-server@3.7.2 --save-dev

五、白丁友记遇到的问题

1.token失效,需要微信浏览器或者微信开发者工具打开才行
2.Google Chrome 不能模拟微信环境
3.在开发者平台输入服务器端的网址,相当于真正跑的项目
4.http://localhost:8080在跨域后的浏览器上输入,然后开发者平台中的Application中Local Storage中的内容复制到浏览器中,即可。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 相关概念 混合开发和前后端分离 混合开发(服务器端渲染) 前后端分离后端提供接口,前端开发界面效果(专注于用户的交...
    他爱在黑暗中漫游阅读 3,081评论 4 45
  • ## 框架和库的区别?> 框架(framework):一套完整的软件设计架构和**解决方案**。> > 库(lib...
    Rui_bdad阅读 3,194评论 1 4
  • 最近在逛各大网站,论坛,以及像SegmentFault等编程问答社区,发现Vue.js异常火爆,重复性的提问和内容...
    忘川慕白阅读 6,174评论 7 113
  • 2017.8.25李保平连接真我指导灵天使们 一、奇迹 1.今早玩我很喜欢的游戏时,好像天使们给我指引,告诉我今晚...
    1保平阅读 409评论 0 0
  • “江上往朱人,但爱鲈鱼美。”“鲈鱼正美不归去”,再比如“鲈鱼千头酒百斛,酒中倒卧南山绿。“好是日斜风定后,半江红...
    余生百味阅读 760评论 1 3

友情链接更多精彩内容