Ich habe Yeoman verwendet, um meine Struktur mit "yo webapp" zu erstellen, habe alle Extras während der Installation über npm ausgeschlossen und die Bootstrap-Dateien manuell heruntergeladen.Gruntfile funktioniert nicht beim Ausführen des Befehls grunt build
Ich versuche, den Befehl "grunt build" auszuführen, der alles im App-Ordner (und seinen Unterordnern und deren Unterordner usw.) übernehmen und die Dateien in einem Dist-Ordner in erstellen, kompilieren, verketten und minimieren sollte das übergeordnete Verzeichnis (auf der gleichen Ebene wie App), da ich mir sicher bin, dass jeder, der Yeoman benutzt hat und grunzt, weiß.
Aus irgendeinem Grund wird es nicht tun, und ich habe versucht, Standardpfade, etc, etc in der gruntfile zu ändern, um zu versuchen, es funktioniert zu machen, aber es funktioniert nicht richtig (um ehrlich zu sein, sagt es nicht t Arbeit überhaupt ist passender, obwohl es in der cmd sagt, dass es tut).
Es vervollständigt die Build-Aufgabe nach dem cmd jetzt (es war nicht vorher, behauptet, es gab ein Problem mit der Imagemin-Task, aber ich änderte das und es funktioniert jetzt (oder so heißt es)), aber wenn ich gucke Im Ordner "dist" gibt es nur eine Datei "index.html" und eine Datei "styles" (die einige der CSS-Dateien nicht enthält, die sie enthalten sollten ...).
ist hier der wichtige Teil meiner Ordnerstruktur:
Site
├───.tmp
│ ├───spec
│ └───styles
├───app
├───fonts
├───images
│ ├───home
│ ├───payments
│ └───profile
├───scripts
│ ├───JS
│ ├───PHP
└───styles
Die TMP-Ordner automatisch aus irgendeinem Grunde erstellt wird, nehme ich an Grunzen mit etwas zu helfen, da es gemacht wird, wenn ich Dateien in der App speichern Ordner und Grunzen schaut zu.
Alles, was ich will, ist einfach:
- Um „Grunzen build“
- Um dann haben Grunzen durch alle Ordner und Dateien
- verketten, ändern, neu erstellen gehen laufen, bewegen und erstellen von Dateien wie erwartet (wenn Sie zusammen Yeoman und Grunzen verwendet haben, werden Sie wissen, was ich meine, und erwarten, treffender)
- in den dist-Ordner Zur Ausgabe
Wenn es hilft, sind die Dateitypen in den Ordnern wie erwartet, der Font-Ordner hat [EOT, TTF, OTF, WOFF, SVG], Bilder und seine Unterordner verwenden [PNG, JPEG, GIF], Skripte hat [ JS, PHP] in sich selbst und seinen Unterordnern und Stilen hat [SASS, SCSS, CSS], aber offensichtlich ist es nur das CSS, das mir wichtig ist, dass ich in dist übergehe.
Das könnte deine Gedanken verkompliziert haben, aber hoffentlich weißt du, was ich erwarte, wenn ich mit yeoman arbeite und vor dir selbst grunze und mir helfen kann, die Aufgaben und die Bewegung in Gang zu bringen.
Hier ist meine gruntfile wie es steht:
// Generated on 2015-11-17 using
// generator-webapp 1.1.0
'use strict';
// # Globbing
// for performance reasons we're only matching one level down:
// 'test/spec/{,*/}*.js'
// If you want to recursively match all subfolders, use:
// 'test/spec/**/*.js'
module.exports = function (grunt) {
// Time how long tasks take. Can help when optimizing build times
require('time-grunt')(grunt);
// Automatically load required grunt tasks
require('jit-grunt')(grunt, {
useminPrepare: 'grunt-usemin'
});
// Configurable paths
var config = {
app: 'app',
dist: 'dist'
};
// Define the configuration for all the tasks
grunt.initConfig({
// Project settings
config: config,
// Watches files for changes and runs tasks based on the changed files
watch: {
bower: {
files: ['bower.json'],
tasks: ['wiredep']
},
babel: {
files: ['<%= config.app %>/scripts/{,*/}*.js'],
tasks: ['babel:dist']
},
babelTest: {
files: ['test/spec/{,*/}*.js'],
tasks: ['babel:test', 'test:watch']
},
gruntfile: {
files: ['Gruntfile.js']
},
styles: {
files: ['<%= config.app %>/styles/{,*/}*.css'],
tasks: ['newer:copy:styles', 'postcss']
}
},
browserSync: {
options: {
notify: false,
background: true,
watchOptions: {
ignored: ''
}
},
livereload: {
options: {
files: [
'<%= config.app %>/{,*/}*.html',
'.tmp/styles/{,*/}*.css',
'<%= config.app %>/images/{,*/}*',
'.tmp/scripts/{,*/}*.js'
],
port: 9000,
server: {
baseDir: ['.tmp', config.app],
routes: {
'/bower_components': './bower_components'
}
}
}
},
test: {
options: {
port: 9001,
open: false,
logLevel: 'silent',
host: 'localhost',
server: {
baseDir: ['.tmp', './test', config.app],
routes: {
'/bower_components': './bower_components'
}
}
}
},
dist: {
options: {
background: false,
server: '<%= config.dist %>'
}
}
},
// Empties folders to start fresh
clean: {
dist: {
files: [{
dot: true,
src: [
'.tmp',
'<%= config.dist %>/*',
'!<%= config.dist %>/.git*'
]
}]
},
server: '.tmp'
},
// Make sure code styles are up to par and there are no obvious mistakes
eslint: {
target: [
'Gruntfile.js',
'<%= config.app %>/scripts/{,*/}*.js',
'!<%= config.app %>/scripts/vendor/*',
'test/spec/{,*/}*.js'
]
},
// Mocha testing framework configuration options
mocha: {
all: {
options: {
run: true,
urls: ['http://<%= browserSync.test.options.host %>:<%= browserSync.test.options.port %>/index.html']
}
}
},
// Compiles ES6 with Babel
babel: {
options: {
sourceMap: true
},
dist: {
files: [{
expand: true,
cwd: '<%= config.app %>/scripts/*',
src: '{,*/}*.js',
dest: '.tmp/scripts',
ext: '.js'
}]
},
test: {
files: [{
expand: true,
cwd: 'test/spec',
src: '{,*/}*.js',
dest: '.tmp/spec',
ext: '.js'
}]
}
},
postcss: {
options: {
map: true,
processors: [
// Add vendor prefixed styles
require('autoprefixer')({
browsers: ['> 1%', 'last 2 versions', 'Firefox ESR']
})
]
},
dist: {
files: [{
expand: true,
cwd: '.tmp/styles/',
src: '{,*/}*.css',
dest: '.tmp/styles/'
}]
}
},
// Automatically inject Bower components into the HTML file
wiredep: {
app: {
src: ['<%= config.app %>/index.html'],
ignorePath: /^(\.\.\/)*\.\./
}
},
// Renames files for browser caching purposes
filerev: {
dist: {
src: [
'<%= config.dist %>/scripts/{,*/}*.js',
'<%= config.dist %>/styles/{,*/}*.css',
'<%= config.dist %>/images/{,*/}*.*',
'<%= config.dist %>/styles/fonts/{,*/}*.*',
'<%= config.dist %>/*.{ico,png}'
]
}
},
// Reads HTML for usemin blocks to enable smart builds that automatically
// concat, minify and revision files. Creates configurations in memory so
// additional tasks can operate on them
useminPrepare: {
options: {
dest: '<%= config.dist %>'
},
html: '<%= config.app %>/index.html'
},
// Performs rewrites based on rev and the useminPrepare configuration
usemin: {
options: {
assetsDirs: [
'<%= config.dist %>',
'<%= config.dist %>/images',
'<%= config.dist %>/styles'
]
},
html: ['<%= config.dist %>/{,*/}*.html'],
css: ['<%= config.dist %>/styles/{,*/}*.css']
},
// The following *-min tasks produce minified files in the dist folder
imagemin: {
dist: {
files: [{
expand: true,
cwd: '<%= config.app %>/images/*',
src: '{,*/}*.*',
dest: '<%= config.dist %>/images'
}]
}
},
svgmin: {
dist: {
files: [{
expand: true,
cwd: '<%= config.app %>/images',
src: '{,*/}*.svg',
dest: '<%= config.dist %>/images'
}]
}
},
htmlmin: {
dist: {
options: {
collapseBooleanAttributes: true,
collapseWhitespace: true,
conservativeCollapse: true,
removeAttributeQuotes: true,
removeCommentsFromCDATA: true,
removeEmptyAttributes: true,
removeOptionalTags: true,
// true would impact styles with attribute selectors
removeRedundantAttributes: false,
useShortDoctype: true
},
files: [{
expand: true,
cwd: '<%= config.dist %>',
src: '{,*/}*.html',
dest: '<%= config.dist %>'
}]
}
},
cssmin: {
dist: {
files: {
'<%= config.dist %>/styles/main.css': [
'.tmp/styles/{,*/}*.css',
'<%= config.app %>/styles/{,*/}*.css'
]
}
}
},
uglify: {
dist: {
files: {
'<%= config.dist %>/scripts/scripts.js': [
'<%= config.dist %>/scripts/scripts.js'
]
}
}
},
concat: {
dist: {}
},
// Copies remaining files to places other tasks can use
copy: {
dist: {
files: [{
expand: true,
dot: true,
cwd: '<%= config.app %>',
dest: '<%= config.dist %>',
src: [
'*.{ico,png,txt}',
'images/{,*/}*.webp',
'{,*/}*.html',
'styles/fonts/{,*/}*.*'
]
}]
},
styles: {
expand: true,
dot: true,
cwd: '<%= config.app %>/styles',
dest: '.tmp/styles/',
src: '{,*/}*.css'
}
},
// Run some tasks in parallel to speed up build process
concurrent: {
server: [
'babel:dist',
'copy:styles'
],
test: [
'babel',
'copy:styles'
],
dist: [
'babel',
'copy:styles',
'imagemin',
'svgmin'
]
}
});
grunt.registerTask('serve', 'start the server and preview your app', function (target) {
if (target === 'dist') {
return grunt.task.run(['build', 'browserSync:dist']);
}
grunt.task.run([
'clean:server',
'wiredep',
'concurrent:server',
'postcss',
'browserSync:livereload',
'watch'
]);
});
grunt.registerTask('server', function (target) {
grunt.log.warn('The `server` task has been deprecated. Use `grunt serve` to start a server.');
grunt.task.run([target ? ('serve:' + target) : 'serve']);
});
grunt.registerTask('test', function (target) {
if (target !== 'watch') {
grunt.task.run([
'clean:server',
'concurrent:test',
'postcss'
]);
}
grunt.task.run([
'browserSync:test',
'mocha'
]);
});
grunt.registerTask('build', [
'clean:dist',
'wiredep',
'useminPrepare',
'concurrent:dist',
'postcss',
'concat',
'cssmin',
'uglify',
'copy:dist',
'filerev',
'usemin',
'htmlmin'
]);
grunt.registerTask('default', [
'newer:eslint',
'test',
'build'
]);
};
Ich würde Screenshots Sie das Problem zu zeigen, aber wie gesagt, wenn ich „Grunzen build“ laufen, geht es an den CMD nach aber nicht tue tatsächlich, was erwartet wird, wie ich erklärt habe.
Wenn Sie irgendwelche Erläuterungen benötigen, lassen Sie es mich wissen.
Cheers,
- SD
Ein paar Fragen: 1. "Ich habe Yeoman verwendet, um meine Struktur mit yo Webapp zu erstellen". Haben Sie Probleme, ein Projekt von Grund auf neu zu starten? 2. Wenn Sie grunt ausführen, erhalten Sie eine Fehlermeldung? – Jodevan
Ich empfehle Ihnen, Node und die zugehörigen Pakete neu zu installieren (Yeoman etc) – ihaveitnow
@Jodevan 1) Nein, nein, ich habe ein Projekt, das begonnen hat, ich erklärte nur, wie ich das Projekt am Anfang gemacht, seit yo erstellt eine andere Gruntfile abhängig In meinem Fall war es der "Webapp" -Generator. 2) Nicht mehr wie ich erklärte, sondern um fair zu sein, wie erklärt, ich vermasselte Wege und Sachen, die versuchten, was ich konnte, jetzt läuft es und rennt, tut aber nicht wirklich, was es bedeutet, wie ich erklärte. – SkullDev