Parcel

发表于

突然听说Parcel, 有一种不明觉厉的气势, 入手玩玩看😊

下载

先下载下来看看吧, 直接装个全局的方便玩耍

1
npm install -g parcel-bundler

开始玩耍

Parcel 可以使用任何类型的文件作为入口, 但是最好还是使用 HTML 或 JavaScript 文件. 如果在 HTML 中使用相对路径引入主要的 JavaScript 文件, Parcel 也将会对它进行处理将其替换为相对于输出文件的 URL 地址.

所以呀, 超级简单就可以开始了呢😏

一个简单的index.html

1
2
3
4
5
6
7
8
<html>
<body>
  <script src="./index.js"></script>
  <p>
    我来了,😁
  </p>
</body>
</html>

一个跟简单的index.js

1
console.log('js执行了呢😏');

然后, 突然执行看看👀, parcel 入口文件名

1
parcel index.html

现在打开 http://localhost:1234/ , 就出现了页面呢

资源

那来看看怎么引入资源吧

j’s 同时支持 CommonJS 和 ES6 两种模块语法来导入文件

css JavaScript 文件或 HTML 文件都能导入 CSS 资源，并且能通过 @import 语法引用依赖，还能通过 url() 函数引入图片，字体等。其他通过 @import 导入的 CSS 文件被内联到同一个CSS包里，并将 url() 引用重写为其输出文件名。所有文件名都应该与当前 CSS 文件相关联。

scss 需要下载依赖 npm install node-sass