【发布时间】：2015-04-24 20:46:10
【问题描述】：
我正在尝试在 Lumen（一个 php 框架）内安装 Foundation for Apps。
我很难弄清楚如何在我的 gulpfile 中配置前端路由器以创建正确的 route.js 文件。
- 在 localhost 上公开的文件位于 /public/index.php（加载正常）
它可以很好地加载 app.css、foundation.js、templates.js、routes.js 和 app.js，它们都在 public/build/assets（我相应地更改了 gulpfile）。
-
但是，routes.js 文件显示：
[{"name":"home","url":"/","path":"client/templates/home.html"}];
代替：
[{"name":"home","url":"/","path":"build/templates/home.html"}];
我该如何解决这个问题？
我的 gulpfile 是：
// FOUNDATION FOR APPS TEMPLATE GULPFILE
// -------------------------------------
// This file processes all of the assets in the "client" folder, combines them with the Foundation for Apps assets, and outputs the finished files in the "build" folder as a finished app.
// 1. LIBRARIES
// - - - - - - - - - - - - - - -
var $ = require('gulp-load-plugins')();
var argv = require('yargs').argv;
var gulp = require('gulp');
var rimraf = require('rimraf');
var router = require('front-router');
var sequence = require('run-sequence');
// Check for --production flag
var isProduction = !!(argv.production);
// 2. FILE PATHS
// - - - - - - - - - - - - - - -
var paths = {
assets: [
'./client/**/*.*',
'!./client/templates/**/*.*',
'!./client/assets/{scss,js}/**/*.*'
],
// Sass will check these folders for files when you use @import.
sass: [
'client/assets/scss',
'bower_components/foundation-apps/scss'
],
// These files include Foundation for Apps and its dependencies
foundationJS: [
'bower_components/fastclick/lib/fastclick.js',
'bower_components/viewport-units-buggyfill/viewport-units-buggyfill.js',
'bower_components/tether/tether.js',
'bower_components/hammerjs/hammer.js',
'bower_components/angular/angular.js',
'bower_components/angular-animate/angular-animate.js',
'bower_components/angular-ui-router/release/angular-ui-router.js',
'bower_components/foundation-apps/js/vendor/**/*.js',
'bower_components/foundation-apps/js/angular/**/*.js',
'!bower_components/foundation-apps/js/angular/app.js'
],
// These files are for your app's JavaScript
appJS: [
'client/assets/js/app.js'
]
};
// 3. TASKS
// - - - - - - - - - - - - - - -
// Cleans the build directory
gulp.task('clean', function(cb) {
rimraf('../public/build', cb);
});
// Copies everything in the client folder except templates, Sass, and JS
gulp.task('copy', function() {
return gulp.src(paths.assets, {
base: './client/'
})
.pipe(gulp.dest('../public/build'))
;
});
// Copies your app's page templates and generates URLs for them
gulp.task('copy:templates', function() {
return gulp.src('./client/templates/**/*.html')
.pipe(router({
path: '../public/build/assets/js/routes.js',
root: './client/templates'
}))
.pipe(gulp.dest('../public/build/templates'))
;
});
// Compiles the Foundation for Apps directive partials into a single JavaScript file
gulp.task('copy:foundation', function(cb) {
gulp.src('bower_components/foundation-apps/js/angular/components/**/*.html')
.pipe($.ngHtml2js({
prefix: 'components/',
moduleName: 'foundation',
declareModule: false
}))
.pipe($.uglify())
.pipe($.concat('templates.js'))
.pipe(gulp.dest('../public/build/assets/js'))
;
// Iconic SVG icons
gulp.src('./bower_components/foundation-apps/iconic/**/*')
.pipe(gulp.dest('../public/build/assets/img/iconic/'))
;
cb();
});
// Compiles Sass
gulp.task('sass', function () {
return gulp.src('client/assets/scss/app.scss')
.pipe($.sass({
includePaths: paths.sass,
outputStyle: (isProduction ? 'compressed' : 'nested'),
errLogToConsole: true
}))
.pipe($.autoprefixer({
browsers: ['last 2 versions', 'ie 10']
}))
.pipe(gulp.dest('../public/build/assets/css/'))
;
});
// Compiles and copies the Foundation for Apps JavaScript, as well as your app's custom JS
gulp.task('uglify', ['uglify:foundation', 'uglify:app']);
gulp.task('uglify:foundation', function(cb) {
var uglify = $.if(isProduction, $.uglify()
.on('error', function (e) {
console.log(e);
}));
return gulp.src(paths.foundationJS)
.pipe(uglify)
.pipe($.concat('foundation.js'))
.pipe(gulp.dest('../public/build/assets/js/'))
;
});
gulp.task('uglify:app', function() {
var uglify = $.if(isProduction, $.uglify()
.on('error', function (e) {
console.log(e);
}));
return gulp.src(paths.appJS)
.pipe(uglify)
.pipe($.concat('app.js'))
.pipe(gulp.dest('../public/build/assets/js/'))
;
});
// RR: took this out; going to use php artisan serve
// Starts a test server, which you can view at http://localhost:8080
// gulp.task('server', ['build'], function() {
// gulp.src('./build')
// .pipe($.webserver({
// port: 8080,
// host: 'localhost',
// fallback: 'index.html',
// livereload: true,
// open: true
// }))
// ;
// });
// Builds your entire app once, without starting a server
gulp.task('build', function(cb) {
sequence('clean', ['copy', 'copy:foundation', 'sass', 'uglify'], 'copy:templates', cb);
});
// RR: changed to not run server
// Default task: builds your app, starts a server, and recompiles assets when they change
// gulp.task('default', ['server'], function () {
gulp.task('default', ['build'], function () {
// Watch Sass
gulp.watch(['./client/assets/scss/**/*', './scss/**/*'], ['sass']);
// Watch JavaScript
gulp.watch(['./client/assets/js/**/*', './js/**/*'], ['uglify:app']);
// Watch static files
gulp.watch(['./client/**/*.*', '!./client/templates/**/*.*', '!./client/assets/{scss,js}/**/*.*'], ['copy']);
// Watch app templates
gulp.watch(['./client/templates/**/*.html'], ['copy:templates']);
});
【问题讨论】：
标签： laravel zurb-foundation lumen