我最近更新了离子及其libs,但这对我来说已经改变了很多东西。
现在,我可以在HTML中进行一些更改,我的livereload只显示它们。当我在某个SCSS文件中执行此操作时,根本不会发生任何事情。所以ionic serve --lab
命令对我来说没用。
这是我的gulpfile.js
var gulp = require('gulp');
var gutil = require('gulp-util');
var bower = require('bower');
var concat = require('gulp-concat');
var sass = require('gulp-sass');
var minifyCss = require('gulp-minify-css');
var rename = require('gulp-rename');
var sh = require('shelljs');
var paths = {
sass: ['./scss/**/*.scss']
};
gulp.task('default', ['sass']);
gulp.task('sass', function(done) {
gulp.src('./scss/ionic.app.scss')
.pipe(sass())
.on('error', sass.logError)
.pipe(gulp.dest('./www/css/'))
.pipe(minifyCss({
keepSpecialComments: 0
}))
.pipe(rename({ extname: '.min.css' }))
.pipe(gulp.dest('./www/css/'))
.on('end', done);
});
gulp.task('watch', function() {
gulp.watch(paths.sass, ['sass']);
});
这是我当地的环境:
Cordova CLI: You have been opted out of telemetry. To change this, run: cordova telemetry on.
6.3.1
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 1.3.1-nightly-4219
Ionic CLI Version: 2.1.0-beta.3
Ionic App Lib Version: 2.1.0-beta.1
ios-deploy version: 1.9.0
ios-sim version: 5.0.8
OS: Mac OS X El Capitan
Node Version: v6.6.0
Xcode version: Xcode 8.0 Build version 8A218a
知道出了什么问题或我该怎么办?我已经尝试了ionic setup sass
,但这只能工作一次。我每次更改代码时都不希望这样。它看起来好像不再看我的SCSS文件了,但我不知道为什么,因为我根本没有改变gulpfile.js
。
答案 0 :(得分:8)
好的,我已经找到了解决方案,但实际上非常令人遗憾的是,离子1.x和离子2.x之间的过渡非常严重,并且无法完美运行。
无论如何,我所做的是:
将此添加到我的gulpfile.js
gulp.task('serve:before', ['default','watch']);
并将我的ionic.config.js
文件更改为:
{
"name": "HereComesTheNameOfYourApp",
"app_id": "YOURIDNUMBERHERE",
"v2": false,
"typescript": false,
"watch": {
"sass": [
"scss/**/*.scss"
],
"html": [
"www/**/*.html"
],
"livereload": [
"www/**/*.html",
"www/**/*.js",
"www/**/*.css"
]
}
}
希望它能帮助别人。
答案 1 :(得分:0)
这是Ionic的一个错误,所以你需要做的就是运行两个命令提示符:
ionic run serve
gulp sass