Parcel is a front-end packaging tool similar to WebPack. As opposed to Webpack. The advantage is that it does not require tedious configuration.

First installation

npm install -g parcel-bundlerCopy the code

Generally speaking. Components used by users. No configuration is required. Use -d for developer advice. Or -g global installation

Initialize the

npm init -y
Copy the code

It’s ready to use now. There are two approaches, the first using absolute paths

 ./node_modules/.bin/parcel  index.html

The second. NPX, the NPX directive means to look in the current directory. Without the trouble of memory paths,

npx parcel index.html

Once called, it automatically installs everything you need. Compared with the webpack. It’s so easy

If node-sass installation fails, go to Baidu or Google and search for “Node Sass installation failed”.

Wait a few seconds and it will prompt you to go to http://localhost:1234

In general, after this site opens. Errors may be reported.



He says you’re using the Runtime version, which is still under-configured. This is available in the official Vue documentation.

Just add a line to package.json

"alias": {
    "vue" : "./node_modules/vue/dist/vue.common.js"
  }Copy the code

Call the parcel again and we’ll see that the problem still exists. This is because parcel read the cache file just now. Again, there are two solutions. The first way to disable caching (recommended)

 npx parcel index.html --no-ca

The second option is to delete the cache file directly (.cache)



With the simplest calls it can still listen for code changes to be packaged in real time, and WebPack is really retarded by comparison.


There are two common errors

No entres found error

Add index.html after parcel

Such as:

/node_modules/.bin/parcel index. HTML NPX parcel NPX parcel index. HTML./node_modules/.bin/parcel index. HTMLCopy the code

2 ERERM error

Try your luck with a globally installed parcel instead:

npm i -g parcel
parcel index.html --no-cacheCopy the code