The uniApp h5 project is packaged through the command line and generates the specified path and file name

Without further ado, let's go straight to the dry goods

Step 1: Create a new project using hbuilder

Part 2: Create a new project through cli

Create command:

vue create -p dcloudio/uni-preset-vue uniapp

After the creation is successful, run the project first, if the startup fails

Error: Cannot find module ‘webpack/lib/RuleSet‘

1. Lower the cli version

npm uninstall -g @vue/cli

npm install -g @vue/[email protected]

2. Reduce the node version

We use hb's project as a base

Back to the topic, use the hb project as the basis,

Step 1: Create a new src folder and put the following files into the src folder

 Step 2: Delete all files in the hb project except src

Step 3: Copy the following files in the cli project

Step 4: Introduce the dependencies in the dependencies in the package.json file in the hb project to the copied package.json file; add "node-sass": "^4.14.1" to devDependencies,

After importing, the file directory structure is as follows:

 

 

 Step 5: npm install

Step 6: npm run dev to run the project

 Step 7: npm run build to package the project

In the build, the build can be divided into test and prod, and
the file name and path generated after packaging can be set through UNI_OUTPUT_DIR

UNI_OUTPUT_DIR=dist/build/h5_prod

 Step 8: File location after successful packaging