uniapp은 패키징 디렉터리를 수정합니다.

UniApp은 Vue.js를 기반으로 하는 크로스 플랫폼 프런트 엔드 프레임워크로, 여러 터미널에서 코드 세트를 쉽게 실행할 수 있습니다. 개발을 위해 UniApp을 사용하는 경우, 프로젝트는 궁극적으로 H5, 미니 프로그램, 앱 등 다양한 단말기에서 요구하는 코드로 패키징되어야 합니다. 이번 글에서는 UniApp의 패키징 디렉터리를 수정하는 방법을 소개하겠습니다.

UniApp의 기본 패키징 디렉터리는 "dist"이며, 이는 다양한 터미널에 필요한 코드를 생성합니다. 예를 들어 H5 코드는 "dist" 디렉터리의 "h5" 폴더에 생성됩니다. UniApp의 패키징 디렉터리를 수정해야 하는 경우 아래 단계를 따르세요.

1. 유니앱 프로젝트 열기

유니앱 프로젝트를 연 후 "build" 항목에서 "webpack.dev.conf.js"와 "webpack.prod.conf.js" 두 개를 찾아야 합니다. 폴더 문서. 이 두 파일은 UniApp을 패키징할 때 필요한 구성 파일입니다.

2. Modify webpack.dev.conf.js

"webpack.dev.conf.js" 파일을 찾아 다음 코드를 찾아보세요.

output: {
  path: config.build.assetsRoot,
  filename: utils.assetsPath('js/[name].[chunkhash].js'),
  chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
}

그 중 "config.build.assetsRoot"는 webpack.dev.conf.js가 있는 루트를 나타냅니다. 패키지된 코드는 디렉토리에 저장되며 기본값은 "dist" 디렉토리입니다. 원하는 디렉터리 이름으로 수정할 수 있습니다. 예를 들어 패키지된 코드를 "build" 디렉터리에 저장합니다.

output: {
  path: config.build.assetsRoot.replace('dist', 'build'),
  filename: utils.assetsPath('js/[name].[chunkhash].js'),
  chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
}

이 시점에서 "webpack.dev.conf.js" 수정이 완료되었습니다.

3. webpack.prod.conf.js

수정 "webpack.prod.conf.js" 파일을 찾아 다음 코드를 찾습니다.

output: {
  path: config.build.assetsRoot,
  filename: utils.assetsPath('js/[name].[chunkhash].js'),
  chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
}

마찬가지로 "config.build.assetsRoot"를 다음과 같이 수정할 수 있습니다. 우리가 원하는 디렉토리 이름입니다.

output: {
  path: config.build.assetsRoot.replace('dist', 'build'),
  filename: utils.assetsPath('js/[name].[chunkhash].js'),
  chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
}

4. vue.config.js 수정

위 두 단계를 완료한 후 수정된 "webpack.dev.js"와 일치하도록 "vue.config.js" 파일의 패키징 경로도 수정해야 합니다. conf.js" 및 "webpack.prod.conf.js" 구성 파일은 일관성이 있습니다.

module.exports = {
  publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
  outputDir: 'build',
  configureWebpack: {
    name: name,
    resolve: {
      alias: {
        '@': resolve('src'),
      }
    }
  },
};

"outputDir"에서는 "build"와 같이 원하는 디렉터리 이름으로 수정합니다.

5. 프로젝트 패키징

위 단계를 완료한 후 전체 UniApp 프로젝트를 다시 패키징할 수 있으며, 패키징한 코드는 우리가 설정한 디렉터리에 저장됩니다.

요약

위의 단계를 통해 UniApp의 패키징 디렉터리를 쉽게 수정할 수 있습니다. 패키징 디렉터리를 수정할 때 디렉터리가 존재하지 않는지 확인하세요. 그렇지 않으면 패키징이 실패할 수 있습니다. 동시에 프로젝트에 리소스 참조 및 기타 작업이 있는 경우 수정된 패키징 경로를 기반으로 해당 수정이 이루어져야 합니다.

위 내용은 uniapp은 패키징 디렉터리를 수정합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!