Package the Taro project to generate different directories

As you know, the Taro project can generate RN, H5, and various platform applets, packaged commands in the scripts node of the package.json file, as shown below.

"scripts": {
		"build:weapp": "taro build --type weapp"."build:swan": "taro build --type swan"."build:alipay": "taro build --type alipay "."build:tt": "taro build --type tt"."build:h5": "cross-env CLIENT_ENV=h5 taro build --type h5"."build:rn": "cross-env CLIENT_ENV=rn taro build --type rn"."dev:weapp": "npm run build:weapp -- --watch"."dev:swan": "npm run build:swan -- --watch"."dev:alipay": "npm run build:alipay -- --watch"."dev:tt": "npm run build:tt -- --watch"."dev:h5": "cross-env CLIENT_ENV=h5 npm run build:h5 -- --watch"."dev:rn": "cross-env CLIENT_ENV=rn npm run build:rn -- --watch"
	}
Copy the code

When we execute the package command, we can generate resource files for different platforms:

yarn build:weapp        // Wechat applets
yarn build:swan         // Baidu small program
yarn build:alipay       // Alipay applet
yarn build:tt           // byte applets
yarn build:jd           // Jingdong mini program.Copy the code

However, if the output path is not configured, the default output path is the dist directory when using the command package above. If we need to package to a different directory, then we need to change the packaging configuration of the config/index.js file. First, add the following configuration:

const outputRootStrtegy = {
  h5: 'dist/h5',
  weapp: 'dist/weapp',
  alipay: 'dist/alipay',
  swan: 'dist/swan',
  jd: 'dist/jd'['undefined'] :'dist'
}
const env = JSON.parse(process.env.npm_config_argv)['cooked'] [1].split(':') [1]
const outputRoot = outputRootStrtegy[env]
Copy the code

Then, modify the config/index.js file config as shown below.

const outputRootStrtegy = {
  h5: 'dist_h5',
  weapp: 'dist_weapp',
  alipay: 'dist_alipay',
  swan: 'dist_swan'['undefined'] :'dist'
}
const env = JSON.parse(process.env.npm_config_argv)['cooked'] [1].split(':') [1]
const outputRoot = outputRootStrtegy[env]

const config = {
  projectName: 'yx',
  date: '2020-12-11',
  designWidth: 750.// omit the code
  sourceRoot: 'src',
  outputRoot: outputRoot,        // Change to a variable
  plugins: {
    
  },
}

Copy the code

Then, re-package and you can see the different subdirectories generated when you package, as shown in the figure below.