本文是构造 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. Gradle Goodness: Add Incremental Build Support to Custom Tasks with Annotations

    In a previous post we learned how we can use the inputs and outputs properties to set properties or ...

  2. linux文件系统写过程简析

    linux写入磁盘过程经历VFS ->  页缓存(page cache) -> 具体的文件系统(ext2/3/4.XFS.ReiserFS等) -> Block IO ->设备 ...

  3. vue中监听页面滚动和监听某元素滚动

    ①监听页面滚动 在生命周期mounted中进行监听滚动: mounted () { window.addEventListener('scroll', this.scrollToTop) }, 在方法 ...

  4. RandomAccessFile类——高效快捷地读写文件

    RandomAceessFile类 RandomAccessFile类是一个专门读写文件的类,封装了基本的IO流,在读写文件内容方面比常规IO流更方便.更灵活.但也仅限于读写文件,无法像IO流一样,可 ...

  5. Java类和对象详解,以及相关知识点

    了解类和对象前,简单提及面向对象程序设计.面向对象程序设计就是通过对象来进行程序设计,对象表示一个可以明确标识的实体.例如:一个人.一本书.一个学校或一台电脑等等.每个对象都有自己独特的标识.状态和行 ...

  6. 关于 web.config impersonate 帐号模拟

    1.模拟 IIS 验证的帐户或用户 若要在收到 ASP.NET 应用程序中每个页的每个请求时模拟 Microsoft Internet 信息服务 (IIS) 身份验证用户,必须在此应用程序的 Web. ...

  7. MySQL 基础小技巧

    把MySQL软件制作成系统服务 .把mysqld软件做成系统服务 注意:制作之前先把mysqld关掉 C:\Windows\system32>tasklist |findstr mysqld m ...

  8. HTML标签速记整理W3C

    标题 <h1>段落<p>链接< href="">图像<img src="">自关闭元素,不需要结束标记换行标志& ...

  9. PHP实现多继承 - 通过接口的多继承特性(二)

    原文地址:http://small.aiweimeng.top/index.php/archives/51.html 在上篇文章中写到php可以使用```Trait```实现代码的复用,下面介绍使用接 ...

  10. [笔记] 升級到 Delphi 10.2 Tokyo 笔记

    升級到 Delphi 10.2 Tokyo 笔记: 更新 Xcode 8.3 & iOS 10.3 测试: macOS 没问题(可 Debug) iOS Simulator 没问题(可 Deb ...