ionic tutorial 이온 2 사용자 정의 빌드 스크립트 추가




ionic tutorial (4)

간단히 gulp 작업을 실행하려면 package.json에 추가하십시오.

"scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
--> "ionic:build": "ionic-app-scripts build && gulp serve:after",
    "ionic:serve": "ionic-app-scripts serve",
    "watch": "ionic-app-scripts watch"
}

참고 : ionic : serve 이후에 "&& gulp"를 넣으면 작동하지 않습니다. - 꿀꺽 마는 일은 첫 번째 부분이 끝날 때까지 기다릴 것이지만 ionic serve는 dev 서버를 시작하고 계속 실행되어 두 번째 부분은 실행되지 않습니다.

CLI를 통해 Ionic 2를 사용하고 있습니다. 이 버전에서는 꿀꺽 마시는 것과는 반대로 NPM 스크립트를 사용합니다.

   "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
 },

구성에 사용자 지정 스크립트를 추가하는 것에 대해 읽었지만이를 수행하는 방법이 명확하지 않습니다. 이건 내 현재 설정입니다 ...

"config": {
    "ionic_bundler": "webpack",
    "ionic_source_map": "source-map",
    "ionic_source_map_type": "eval"
  },

"replace"라는 사용자 지정 스크립트를 만들어야합니다. NPM replace를 사용할 것입니다. 이것을 어떻게 추가하여 ionic serve를 실행하거나 실행할지를 결정할 수 있습니까?

다음은 실행하려는 룰 코드입니다.

var gulp = require('gulp');
var replace = require('gulp-string-replace');
var p = require('./package.json');
var version = p.version;
gulp.task('serve:after', ['version']);

console.log('Task init!!!');
gulp.task('version', function() {
  gulp.src(["./www/index.html"])
  .pipe(replace(/VERSION/g, p.version))
    .pipe(gulp.dest('./www/'));
});

NPM에서 Gulp Task를 실행하려는 경우

다음과 같이 npm install --save-dev gulp-npm-script-sync gulp-npm-script-sync 를 추가하십시오. npm install --save-dev gulp-npm-script-sync

이제 다음과 같이이 꿀꺽 꿀꺽 한 작업을 package.json 에 동기화해야합니다.

var gulp = require('gulp');
var sync = require('gulp-npm-script-sync');

// your gulpfile contents

sync(gulp);

gulpfile을 새로운 작업으로 업데이트 할 때마다 package.json이 업데이트됩니다.

당신은 꿀꺽 거리는 일 안에 던질 수도 있습니다 :

gulp.task('sync', function () {
  sync(gulp);
}

먼저, 소스 코드 / 프로젝트 / 태스크에서 수정하고 붙이려는 기존 작업을 복사하고 붙여 넣어야합니다. 그런 다음 해당 파일에 작업을 추가하십시오. 이온 2 기본 설정을 덮어 쓰도록 package.json을 변경하십시오.

"config": {
    "ionic_cleancss": "./task/cleancss.config.js"
  }, 

자세한 정보 : https://github.com/ionic-team/ionic-app-scripts#custom-configuration


Ionic CLI (v3.X)는 gulpfile.js로 직접 이동하여 CLI 후크를 찾습니다.

이온 성 서브 :

gulp.task('ionic:watch:before', function() {
  console.log("this is run before 'ionic serve'");
});

이온 빌드 :

gulp.task('ionic:build:before', function() {
  console.log("this is run before 'ionic build'");
});

그래서 gulpfile.js 다음과 같이 추가해야합니다.

gulp.task('ionic:watch:before', ['version']);
gulp.task('ionic:build:before', ['version']);