一个基础的webpack项目demo
闲来无事,手工搭建一个webpack最基础的项目,可与项目初始化节省搭建时间,话不多说,上料!
其中包含了:
1 样式加载器css,sass,less
2 图片加载器
3 webpack-dev-server本地开发热更新
4 babel配置:
闲来无事,手工搭建一个webpack最基础的项目,可与项目初始化节省搭建时间,话不多说,上料!
1 样式加载器css,sass,less
2 图片加载器
3 webpack-dev-server本地开发热更新
4 babel配置:
前端开发的朋友们,不免会有要模拟假数据的时候,当然你的项目中有模拟数据的配置(如mock)则更好;
但是当仅仅就是想起个服务端,模拟点假数据便于开发调用,那么今天就给大家介绍一种快捷有效的方法:
最近在玩vue3.x版本的时候,在vue create project创建项目的时候报错了,其实就是npm install安装东西的时候报的这个错误;
原因是node之前版本较低,升级版本后出现了;如何解决呢?
解决办法,升级之后运行:npm cache clean --force
即可解决pm install出现”Unexpected end of JSON input while parsing near”错误。
书写此篇,主要针对您的项目是create-react-app搭建的(未eject配置的),并且用的antd-design UI库还是2.x版本之前的,本篇也许对你有极大帮助。
此时的antd已经是3.9.1版本了,早早的已经是3.x以上了,也不存在上述问题,那么您可以忽略此篇了!
今天,我们增加一下对数据的增删改查的开发,这里不涉及用后台数据,而是使用json-server这个模拟数据的工具(可自行学习,这里不做详述)来实现。
我们索性就对音乐页面做开开发吧:https://localhost:9999/music,现有截图如下:
关于布局,我们以偏向管理系统的风格为例,采用上左右布局,即:上放置logo,账户信息等公共数据,左放置菜单分类,多级导航等,右放置主体业务内容等。
目前的项目架构,大家都能看到,有路由跳转的地方都是写死的url,如<Link to={'/aaa'}>,push({pathname:'/login'}),这种方式呢,没有问题,但是这样写死不太好,不便于后期维护,
比如以后要改下路径,除了config.js中需要改一次,代码全篇幅都需要改一次,好累;name该怎么办呢?以下我们就来处理一下路由的优化!
基于create-react-app官方脚手架搭建dva模式的项目-权限布局的开发,之前的项目骨架已经可以按照你自己的业务和项目逻辑去组装汽车了。
这里依然以上项目骨架为基础,增加权限布局的开发。
接上一篇:http://blog.ixiewei.com/index.php/archives/205.html
项目配置到这里之后,接下来就需要处理以下配置了:
1 国际化
2 store的数据存储结构
此处采用immutable数据格式(immutable一款很棒的数据操作工具,此处不做详解,有兴趣的同学可自行学习),把数据存于model,同样国际化的判断参数定为: i18n 存于app的model中,取值来源于浏览器的本地缓存localStorage用户若设置了某种语言,则存在这里,用户下次访问系统,也依然能唤起上次所选中的语言,当初次访问时,语言默认先取自浏览器,若依然取不到则默认咱们的中文。