美文网首页
使用webpack-howto示例

使用webpack-howto示例

作者: 懒先森 | 来源:发表于2015-10-24 23:40 被阅读240次

    唠叨在前面

    可能跟绝大多数认识webpack的机缘不同,大多数使用webpack是使用过react或者browse什么鬼的那个;
    前一阵子纠结在avalon和vue之间做选型,怎奈avalon路由上有一些地方没有使用明白,虽然也做出来了,但感觉十分不妥,据说近期要升级路由,观望中,趁着松口气尝试下vuejs作者的大头像学霸味道十足,好像刚探月回来;

    本机环境&准备工作

    • 操作系统 MAC OSX EI Capitan
    • 软件环境:
    • node(国内可以把源切换为淘宝CNPM)
    • gcc编译器(预装了xcode)
    • 自带python

    如果是window平台下,要安装vc运行库,.net4.0等,具体要看到安装插件时是哪个插件报错,去它的github上看依赖什么环境,安装即可;咳咳,很有可能要安装一个完整的visual studio……辛苦win下的同胞

    下载webpack-howto示例程序

    下载地址

    运行

    • 终端切换到项目目录/webpack-howto/example
    • npm install --save-dev webpack webpack-dev-server react-hot-loader -g 说明:全局安装webpack webpack-dev-server 以后总用 得用命令行
    • npm install 安装项目依赖的插件
    • webpack webpack.config.js 打包,成功如下图
    • webpack-dev-server --hot --quiet 启动服务



      启动成功

    • 访问试试看


    如果一切顺利的话,确实是OK的,然而理想总是同教程离得太远

    你会遇到的问题

    • 安装webpack-dev-server报错

    出现类似error: redefinition of '_NanEnsureLocal'的错误,八成是socket.io这个插件的问题详细看issue

    解决方法:手动更新webpack-dev-server的依赖描述文件,将socket.io/client的版本号更新到1.3.7 或者down我改后的

    • 出现C:\Microsoft.Cpp.Default.props 解决方法就是安装所要求的编译环境

    相关文章

      网友评论

          本文标题:使用webpack-howto示例

          本文链接:https://www.haomeiwen.com/subject/xttxhttx.html