1: add prod
mode to package.json and package it as a production environment, as follows
"scripts": {
"dev": "vue-cli-service serve",
"build": "vue-cli-service build",
"prod": "vue-cli-service build --mode prod"
}
2: add .env.prod file
NODE_ENV = "prod"
VUE_APP_TITLE = "prod"
3: the structure of the packaged file after executing yarn run prod is as follows: js is uncompressed
dist
fonts
ionicons.d535a25a.ttf
img
404.a57b6f31.png
0.js
1.js
10.js
11.js
12.js
13.js
14.js
15.js
16.js
17.js
18.js
19.js
2.js
20.js
21.js
22.js
23.js
24.js
25.js
26.js
27.js
28.js
29.js
3.js
30.js
31.js
32.js
4.js
5.js
6.js
7.js
8.js
9.js
app.js
favicon.ico
index.html
and the structure of the packaged file using yarn run build
is as follows
dist
css
app.7a85a07c.css
chunk-0604759a.5d6e2348.css
.....
chunk-vendors.abeab9d7.css
fonts
ionicons.d535a25a.ttf
img
404.a57b6f31.png
js
app.ea166f07.js
chunk-0604759a.7923a01a.js
chunk-0a2cc683.48cfed43.js
chunk-0ed874c9.71ef4278.js
chunk-1087bb1f.f0f4cfec.js
chunk-187c526f.867ab8fd.js
chunk-1b46a105.023270fc.js
chunk-1ecf3cca.1d223a6e.js
chunk-2372d311.63d6b4a6.js
chunk-26c401f8.be853f54.js
chunk-28204654.b10ad966.js
chunk-2e4a4a92.8890bf91.js
chunk-32c4c08e.1d03fdf2.js
chunk-3813bc82.600b4ecc.js
chunk-3b2358f2.22506c01.js
chunk-405f2a88.860b3ed3.js
chunk-44386673.ce452587.js
chunk-4cb52e7a.4da34330.js
chunk-6f4e1cdf.2032cc46.js
chunk-761b47f5.6b640b83.js
chunk-7b1539d2.7ba2d70a.js
chunk-7dc86e44.198af0fa.js
chunk-95693410.26c158c4.js
chunk-a054b0f2.0c4952fd.js
chunk-cc3d3f00.3327ae0a.js
chunk-ec79c908.5a5cdeac.js
chunk-ed37fce8.82503de2.js
chunk-fa23f3d4.72e5cbfb.js
chunk-vendors.e32712db.js
favicon.ico
index.html
I hope prod
can perform the same as build
to modify NODE_ENV is to switch apiUrl. Can you execute commands such as compression only if it is set to production
?
< hr >
there are too many chunkjs files, how to optimize?