本文是构造 UI 轮子过程中搭建项目初始化时使用 Parcel 作为打包器的简要使用记录。

安装

参考 官方文档

使用 npm 进行 parcel-bundler 的安装。

npm i -D parcel-bundler

为什么要用 -D ? 如果一个 npm 包是给用户使用的,不用加 -D。如果是给开发者使用,需要加 -D。(或者全局安装)

 

打包

安装完成之后,需要进行打包的操作。

使用下列命令进行 parcel 的初次打包,如果出现红色报错,就在后面加上 index.html即可。

./node_modules/.bin/parcel
 

注意: 这里还需要注意的问题的是,初次进入之后。还需要给 package.json 进行配置。因为是 runtime-only 模式,所以会出现下列报错。

 
 

配置完毕后,还是使用 ./node_modules/.bin/parcel index.html 进行打包编译,或者使用,效果是一样的。

npx parcel index.html
 

清除缓存

建议先清除第一次编译失败的缓存。或者在末尾使用 --no-cache

rm -rf .cache
 

Parcel 打包器简单使用记录的更多相关文章

  1. webpack打包器简单入门

    概念 webpack是一个现代javascript应用程序的模块打包器. 当webpack处理你的应用程序时,它会递归构建一个依赖图(包含了你的应用程序所需要每个模块),然后把这些模块打包到少数几个b ...

  2. UnityShader 表面着色器简单例程集合

    0.前言 这些简单的shader程序都是写于2015年的暑假.当时实验室空调坏了,30多个人在实验室中挥汗如雨,闷热中学习shader的日子还历历在目.这些文章闲置在我个人博客中,一年将过,师弟也到了 ...

  3. 【Python】装饰器实现日志记录

    好的日志对一个软件的重要性是显而易见的.如果函数的入口都要写一行代码来记录日志,这种方式实在是太低效了,但一直没有找到更好的方法.后来用python写一些软件,了解到python的装饰器功能时,突然人 ...

  4. Quick-Cocos2d-x Lua脚本加密打包器

    准备开新项目了,在寻找合适的框架,后来就发现了Quick-Cocos2d-x这玩意. 别说,还挺好使.之后一步步研究,发现Lua不加密是不行的. 加密的方法在这里. 因为在做版本更新的时候,一般大家都 ...

  5. 如果简单的记录,就可以为这个世界创造更多的财富,那么还有什么理由不去写博客呢? — 读<<黑客与画家>> 有感

    上一次博文发文时间是2016.1.15,7个月已经过去了.最近读了一本<>的书,对我触动挺大的!里面有关于技术趋势的探讨,也有关于人生和财富的思考! 开始更新iOS122的文章的初衷是,聚 ...

  6. Webpack - CommonJs & AMD 模块打包器

    Webpack 是一个 CommonJs & AMD 模块打包器.可以把你的 JavaScript 代码分离为多个包,在需要的时候进行加载,支持预处理文件,例如 json, jade, cof ...

  7. Python简单爬虫记录

    为了避免自己忘了Python的爬虫相关知识和流程,下面简单的记录一下爬虫的基本要求和编程问题!! 简单了解了一下,爬虫的方法很多,我简单的使用了已经做好的库requests来获取网页信息和Beauti ...

  8. js模块化/js模块加载器/js模块打包器

    之前对这几个概念一直记得很模糊,也无法用自己的语言表达出来,今天看了大神的文章,尝试根据自己的理解总结一下,算是一篇读后感. 大神的文章:http://www.css88.com/archives/7 ...

  9. redis5.0.3单实例简单安装记录

    redis5.0.3单实例简单安装记录 日常需要测试使用,索性记录下来,免得临时又麻烦的找资料. yum -y install make gcc-c++ cmake bison-devel ncurs ...

随机推荐

  1. HDU Virtual Friends(超级经典的带权并查集)

    Virtual Friends Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)T ...

  2. vlc源码分析(三) 调用live555接收RTSP数据

    首先了解RTSP/RTP/RTCP相关概念,尤其是了解RTP协议:RTP与RTCP协议介绍(转载). vlc使用模块加载机制调用live555,调用live555的文件是live555.cpp. 一. ...

  3. STM32启动代码分析

    STM32启动文件简单分析(STM32F10x.s适用范围)定时器, 型号, 名字在<<STM32不完全手册里面>>,我们所有的例程都采用了一个叫STM32F10x.s的启动文 ...

  4. @property & @synthesize & @dynamic 及相关属性作用探究

    @property : iOS6 引入关键词. @property name; 指示编译器自动生成 name 的 setter 和 getter 方法 : - (NSString *)name; - ...

  5. Python 分支、循环、条件、枚举

    对于表达式,分为“左结合”和“右结合” 左结合:对于没有 = 号的,从左到右边,当然要考虑优先级. 右结合:对于有 = 号存在的情况,右边的自成一体,然后赋值给左边变量   优先级: 逻辑运算符的优先 ...

  6. Redis的特性以及优势(附官网)

    NoSQL:一类新出现的数据库(not only sql) 泛指非关系型的数据库 不支持SQL语法 存储结构跟传统关系型数据库中的那种关系表完全不同,nosql中存储的数据都是KV形式 NoSQL的世 ...

  7. 网易云易盾CTO朱浩齐:我们是如何用AI赋能内容安全?

    本文由  网易云发布. 5月19日,LiveVideoStack携手网易云易盾,共同打造了“娱乐多媒体开发应用实践”专题,帮助开发者和泛娱乐平台运营人员,提升技术能力,突破难点,拓展思路与视野. 在专 ...

  8. C#中的抽象方法,虚方法,接口之间的对比

    1.首先来看一看抽象类 抽象类是特殊的类,不能够被实例化:具有类的其他特性:抽象方法只能声明于抽象类中,且不包含任何实现 (就是不能有方法体),派生类也就是子类必须对其进行重写.另外,抽象类可以派生自 ...

  9. 浅谈JVM编译原理->.java文件转变为.class文件的过程

    为什么需要编译? 我们平常写代码,有规范的命名方式,都能够看得懂,但是我们写的代码计算机是看不懂的,所以需要编译,也就是一个转换的过程,如下: 1.这个是咱们平时写的代码,就比较好理解,对人友好 2. ...

  10. 93. Balanced Binary Tree [easy]

    Description Given a binary tree, determine if it is height-balanced. For this problem, a height-bala ...