README

将 skeletor 工具和架构添加到现有的 Laravel 5 项目中。

将此包添加到 composer.json 中

"require": {
    "php": ">=5.6.4",
    "laravel/framework": "5.3.*",
    "ams/skeletor-laravel" : "dev-master"
},

确保已将 AMS Packagist 添加到存储库

"repositories": [
    {
        "type": "composer",
        "url": "https://repo.packagist.com/atlanticmediastrategies/"
    },
    {
        "packagist": false
    }
]

然后

$ composer update

并且

$ composer dump-autoload 以确保成功

添加服务提供者

config/app.php

/*
 * Package Service Providers...
 */

AMS\Skeletor\SkeletorServiceProvider::class,

将基础文件发布到资源

创建目录结构，必要的 .scss 和 .js 文件，以及一些基本起始项到 resources/views/

$ php artisan vendor:publish --tag=skeletor

将 NPM 依赖添加到 package.json

"dependencies": {
    "autoprefixer": "^6.3.1",
    "babel-plugin-lodash": "^2.3.0",
    "babel-plugin-transform-object-assign": "^6.5.0",
    "babel-preset-es2015": "^6.6.0",
    "babelify": "^7.3.0",
    "bourbon": "^4.2.6",
    "bourbon-neat": "^1.7.2",
    "browser-sync": "^2.11.1",
    "browserify": "^13.0.0",
    "colors-sass": "^1.0.0",
    "cssnano": "^3.4.0",
    "domready": "^1.0.8",
    "famous-polyfills": "^0.3.0",
    "globby": "^4.0.0",
    "gulp": "^3.9.0",
    "gulp-babel": "^6.1.1",
    "gulp-concat": "^2.6.0",
    "gulp-filter": "^4.0.0",
    "gulp-inject": "^4.0.0",
    "gulp-jsdoc3": "^0.2.1",
    "gulp-load-plugins": "^1.2.2",
    "gulp-notify": "^2.2.0",
    "gulp-plumber": "^1.0.1",
    "gulp-postcss": "^6.0.1",
    "gulp-sass": "^2.1.1",
    "gulp-size": "^2.0.0",
    "gulp-sourcemaps": "^1.6.0",
    "gulp-svgmin": "^1.2.2",
    "gulp-svgstore": "^6.0.0",
    "lodash": "^4.11.1",
    "node-sass-magic-importer": "^0.1.4",
    "normalize.css": "^3.0.3",
    "path": "^0.12.7",
    "picturefill": "^3.0.2",
    "postcss-scss": "^0.1.3",
    "sass-list-maps": "^1.0.0-b",
    "through2": "^2.0.1",
    "tooltip": "^1.6.1",
    "vinyl-buffer": "^1.0.0",
    "vinyl-source-stream": "^1.1.0"
},
"devDependencies": {
    "animate.css": "^3.5.2",
    "colors.css": "^2.3.0",
    "gulp-mocha": "^2.2.0",
    "gulp-uglify": "^1.5.3",
    "gulp-uglifyjs": "^0.6.2",
    "jump.js": "^1.0.1",
    "karma": "^0.13.22",
    "mocha": "^2.4.5",
    "nightmare": "^2.3.4",
    "node-sass-glob-once": "^1.0.0-pre1",
    "should": "^8.3.1",
    "whatwg-fetch": "^1.0.0"
}

安装依赖

• 通过 $ yarn 使用 npm

启动服务器

• app: $ php artisan serve --host=0
• gulp: $ gulp --gulpfile gulpfile.skeletor.js

您可以使用 rundev.sh 脚本来简化这些操作。要确保它是可执行的

$ chmod a+x serve.sh

然后运行

• app: $ ./serve.sh artisan
• gulp: $ ./serve.sh gulp

或者，如果您想将 skeletor 设置为 gulp 的默认值，只需删除旧的并更改名称

$ rm -rf gulpfile.js && mv gulp.skeletor.js gulpfile.js

访问 /skeletor，以验证一切是否正常。

命令

Skeletor 附带有以下命令，以帮助您管理视图。

skeletor:make

创建新内容

$ php artisan skeletor:make {type} {slug} {element} {--js} {--description=optional} {--admin} {--bare}

• type: basic, component, module 和 template
• slug: 目录名称，应为 'slug-styled'
• element: 指定 HTML 元素，将在模板中打印
• js: 添加 JS 文件
• description: 将在 README 中打印
• admin: 在管理员（默认）与系统之间创建视图
• bare: 仅创建模板和 README

skeletor:reset

清空每个视图类型文件夹的内容，从头开始

$ php artisan skeletor:reset {folder}