主流框架的搭建(VUE,React)
vue脚手架:
cnpm install vue vue-cli -g
vue init webpack/webpack-simple shuaige(新建文件夹的名字)
cd shuaige
cnpm install
npm run dev
打包npm run build
react脚手架:
cnpm install create-react-app -g
create-react-app shuaige(新建文件夹名字)
cd shuaige
cnpm install
运行是npm start
打包npm run build
cnpm install serve -g
serve -s build
/*开发模式devD,你开发是用的*/
有关webpack自己配置的问题:
1.npm init (生成pack.json);
2.cnpm install webpack-cli -g(webpack -v【当时我用的是4.X】);
3.cnpm install webpack -D;
4.cnpm install webpack-cli -D;
5.entry(入口文件),output(出口文件),plugins:{},有关title的问题(<%=htmlWebpackPlugin%>),pack.json("build":"webpack --mode development");
6.clean-webpack-plugin:删除某些东西
7.服务器环境【webpack-dev-server】("dev":"webpack-dev-server --mode development")
8.loaders:加载器,转化器less/scss,ES[style-loader,css-loader],use:[{loader:'style-loader'},{loader:'css-loader'}],压缩,--mode production
9.cnpm install file-loader url-loader -D
10.extract-text-webpack-plugin[分离css],
11.遇见替代,版本太低(extract-text-webpack-plugin@next)
遇见路径问题publicPath:'../'[vue项目上线时,哪里见过]
outputPath:'images'[打包出去的路径]
new extractTextPlugin(提取出去的路径css/index.css)
mini-css-extract-plugin:(2018/3.23支持不好)
*********less*******
cnpm install less less-loader -D
*****sass****
postCss 预处理器(自动添加浏览器前缀)
主流框架的搭建(VUE,React)的更多相关文章
- 前端三大框架(Angular Vue React)
前端,HTML(超文本标记语言),CSS(层叠样式表)和JavaScript(脚本语言) HTML,通常说的h5,其实按标准来说,HTML4的后续版本不带编号了,并保证向前的兼容性 CSS的版本3,增 ...
- 2015前端各大框架比较(angular,vue,react,ant)
前端流行框架大比拼 angular vue react ant-design angularjs angular是个MVVM的框架.针对的是MVVM这整个事.angular的最主要的场景就是单页应用, ...
- 前端三大主流框架的对比React、Vue、Angular
前端三大主流框架的对比React.Vue.Angular React 起源于 Facebook 的内部项目,用来架设 Instagram 的网站, 并于 2013年 5 月开源.React 拥有较高的 ...
- angular vue react web前端三大主流框架的对比
首先,我们先了解什么是MVX框架模式? MVX框架模式:MVC+MVP+MVVM 1.MVC:Model(模型)+View(视图)+controller(控制器),主要是基于分层的目的,让彼此的职责分 ...
- 三种Web前端框架比较与介绍--Vue, react, angular
一.Angular 1.MVVM(Model)(View)(View-model): 2.模块化(Module)控制器(Contoller)依赖注入: 3.双向数据绑定:界面的操作能实时反映到数据,数 ...
- 手把手教你使用Vue/React/Angular三大框架开发Pagination分页组件
DevUI是一支兼具设计视角和工程视角的团队,服务于华为云DevCloud平台和华为内部数个中后台系统,服务于设计师和前端工程师.官方网站:devui.designNg组件库:ng-devui(欢迎S ...
- 搭建App主流框架_纯代码搭建(OC)
转载自:http://my.oschina.net/hejunbinlan/blog/529778?fromerr=EmSuX7PR 搭建主流框架界面 源码地址在文章末尾 达成效果 效果图 注:本文部 ...
- Vue, React, AngularJS, Angular2 我们对流行JavaScript框架们的选择
转自<奇舞周刊>,好文章mark一下 分割线 一个有趣的事实是:IBM发表的2017年最值得学习的编程语言名单中,JavaScript榜上有名.这位IT巨头指出,JS在网站中惊人地达到94 ...
- 10分钟搭建 App 主流框架
搭建主流框架界面 0.达成效果 我们玩iPhone应用的时候,有没发现大部分的应用都是上图差不多的结构,下面的TabBar控制器可以切换子控制器,上面又有Navigation导航条 我们本文主要是搭建 ...
随机推荐
- Spring Boot + Mybatis 实现动态数据源
动态数据源 在很多具体应用场景的时候,我们需要用到动态数据源的情况,比如多租户的场景,系统登录时需要根据用户信息切换到用户对应的数据库.又比如业务A要访问A数据库,业务B要访问B数据库等,都可以使用动 ...
- 如何确定Isilon cluster的网卡类型是40GbE的还是10GbE的
可以使用isi upgrade cluster firmware devices命令. 从命令行输出可以看到,当前的cluster使用的是40G的前端网卡. 如果是10G网卡,输出结果应当是如下的样子 ...
- spring boot swagger-ui.html 404
很奇怪的问题,找了好久. 因为spring boot+swagger实现起来很简单.看下面三部曲: 1.pom添加两个swagger依赖. <!-- Swagger依赖包 --> < ...
- Android 使用easeui 3.0 集成环信即时通讯 我踩过的坑
0.关于注冊账号就不用说了. 1.创建应用.获取appkey 0.创建应用 1.填写信息 2.获取appkey 2.集成 0.首先新建一个project 1.这里主要介绍使用easeui来集成环信的即 ...
- 【T09】要认识到TCP是一个可靠的,但不是绝对可靠的协议
1.稍微想一下就知道,TCP不是绝对可靠的协议,比如:网络断开,主机崩溃,无论TCP如何努力,都无法将数据传给对方. 2.考虑应用程序A向应用程序B发送数据的TCP流程,数据流从应用程序A通过他所在主 ...
- Net Core 的配置模式以及热重载配置
https://www.cnblogs.com/Leo_wl/p/8527535.html https://blog.csdn.net/ma_jiang/article/details/5350198 ...
- Native App开发 与Web App开发(原生与web开发优缺点)
Native App开发 Native App开发即我们所称的传统APP开发模式(原生APP开发模式),该开发针对IOS.Android等不同的手机操作系统要采用不同的语言和框架进行开发,该模式通常是 ...
- Centos 7.x nginx隐藏版本号
一.打开配置文件 #vim /etc/nginx/nginx.conf 二.增加一行: server_tokens off; 三.重启nginx #nginx -s reload 四.效果
- [U3D Demo] 手机FPS射击游戏
游戏截图 使用插件 DOTween Easy Touch UGUI 游戏介绍 游戏使用C#开发,是在<Unity3D手机游戏开发>一书第3章游戏的基础上优化和修改的. 机枪镭射光线和枪口特 ...
- NameError:name ‘xrange’ is not defined
运行某代码时,报错: NameError:name 'xrange' is not defined 原因: 在Python 3中,range()与xrange()合并为range( ).我的pytho ...