From 6a1848e3115773399eed20f77906c3e7517ac93e Mon Sep 17 00:00:00 2001 From: shibafu Date: Tue, 5 Mar 2019 00:06:04 +0900 Subject: [PATCH] =?UTF-8?q?=E6=97=A2=E5=AD=98=E3=81=AE=E3=83=95=E3=82=A1?= =?UTF-8?q?=E3=82=A4=E3=83=AB=E5=8C=96=E3=81=95=E3=82=8C=E3=81=A6=E3=81=84?= =?UTF-8?q?=E3=82=8B=E3=83=95=E3=83=AD=E3=83=B3=E3=83=88=E3=82=B3=E3=83=BC?= =?UTF-8?q?=E3=83=89=E3=82=92=E5=85=A8=E3=81=A6assets=E3=81=AB=E7=A7=BB?= =?UTF-8?q?=E5=8B=95=E3=81=97=E3=80=81mix=E3=83=93=E3=83=AB=E3=83=89?= =?UTF-8?q?=E3=81=AE=E6=BA=96=E5=82=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 4 ++ resources/assets/js/app.js | 21 ------- resources/assets/js/bootstrap.js | 60 ++++--------------- resources/assets/js/components/Example.vue | 23 ------- {public => resources/assets}/js/tissue.js | 0 resources/assets/sass/_variables.scss | 38 ------------ resources/assets/sass/app.scss | 15 +++-- .../css => resources/assets/sass}/tissue.css | 0 webpack.mix.js | 5 +- 9 files changed, 27 insertions(+), 139 deletions(-) delete mode 100644 resources/assets/js/components/Example.vue rename {public => resources/assets}/js/tissue.js (100%) delete mode 100644 resources/assets/sass/_variables.scss rename {public/css => resources/assets/sass}/tissue.css (100%) diff --git a/.gitignore b/.gitignore index f96b13b..55d3da6 100644 --- a/.gitignore +++ b/.gitignore @@ -1,6 +1,10 @@ /node_modules +/public/css +/public/fonts +/public/js /public/hot /public/storage +/public/mix-manifest.json /storage/*.key /vendor /.idea diff --git a/resources/assets/js/app.js b/resources/assets/js/app.js index c1620c1..40c55f6 100644 --- a/resources/assets/js/app.js +++ b/resources/assets/js/app.js @@ -1,22 +1 @@ - -/** - * First we will load all of this project's JavaScript dependencies which - * includes Vue and other libraries. It is a great starting point when - * building robust, powerful web applications using Vue and Laravel. - */ - require('./bootstrap'); - -window.Vue = require('vue'); - -/** - * Next, we will create a fresh Vue application instance and attach it to - * the page. Then, you may begin adding components to this application - * or customize the JavaScript scaffolding to fit your unique needs. - */ - -Vue.component('example', require('./components/Example.vue')); - -const app = new Vue({ - el: '#app' -}); diff --git a/resources/assets/js/bootstrap.js b/resources/assets/js/bootstrap.js index 8e0f04e..81c1799 100644 --- a/resources/assets/js/bootstrap.js +++ b/resources/assets/js/bootstrap.js @@ -1,53 +1,17 @@ +// jQuery +import './tissue'; -window._ = require('lodash'); - -/** - * We'll load jQuery and the Bootstrap jQuery plugin which provides support - * for JavaScript based Bootstrap features such as modals and tabs. This - * code may be modified to fit the specific needs of your application. - */ - -try { - window.$ = window.jQuery = require('jquery'); - - require('bootstrap-sass'); -} catch (e) {} - -/** - * We'll load the axios HTTP library which allows us to easily issue requests - * to our Laravel back-end. This library automatically handles sending the - * CSRF token as a header based on the value of the "XSRF" token cookie. - */ - -window.axios = require('axios'); - -window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest'; - -/** - * Next we will register the CSRF Token as a common header with Axios so that - * all outgoing HTTP requests automatically have it attached. This is just - * a simple convenience so we don't have to attach every token manually. - */ - -let token = document.head.querySelector('meta[name="csrf-token"]'); - -if (token) { - window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content; -} else { +// Setup global request header +const token = document.head.querySelector('meta[name="csrf-token"]'); +if (!token) { console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token'); } -/** - * Echo exposes an expressive API for subscribing to channels and listening - * for events that are broadcast by Laravel. Echo and event broadcasting - * allows your team to easily build robust real-time web applications. - */ +$.ajaxSetup({ + headers: { + 'X-CSRF-TOKEN': token.content + } +}); -// import Echo from 'laravel-echo' - -// window.Pusher = require('pusher-js'); - -// window.Echo = new Echo({ -// broadcaster: 'pusher', -// key: 'your-pusher-key' -// }); +// Bootstrap +import 'bootstrap'; diff --git a/resources/assets/js/components/Example.vue b/resources/assets/js/components/Example.vue deleted file mode 100644 index 601e61c..0000000 --- a/resources/assets/js/components/Example.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - diff --git a/public/js/tissue.js b/resources/assets/js/tissue.js similarity index 100% rename from public/js/tissue.js rename to resources/assets/js/tissue.js diff --git a/resources/assets/sass/_variables.scss b/resources/assets/sass/_variables.scss deleted file mode 100644 index 53202ac..0000000 --- a/resources/assets/sass/_variables.scss +++ /dev/null @@ -1,38 +0,0 @@ - -// Body -$body-bg: #f5f8fa; - -// Borders -$laravel-border-color: darken($body-bg, 10%); -$list-group-border: $laravel-border-color; -$navbar-default-border: $laravel-border-color; -$panel-default-border: $laravel-border-color; -$panel-inner-border: $laravel-border-color; - -// Brands -$brand-primary: #3097D1; -$brand-info: #8eb4cb; -$brand-success: #2ab27b; -$brand-warning: #cbb956; -$brand-danger: #bf5329; - -// Typography -$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; -$font-family-sans-serif: "Raleway", sans-serif; -$font-size-base: 14px; -$line-height-base: 1.6; -$text-color: #636b6f; - -// Navbar -$navbar-default-bg: #fff; - -// Buttons -$btn-default-color: $text-color; - -// Inputs -$input-border: lighten($text-color, 40%); -$input-border-focus: lighten($brand-primary, 25%); -$input-color-placeholder: lighten($text-color, 30%); - -// Panels -$panel-default-heading-bg: #fff; diff --git a/resources/assets/sass/app.scss b/resources/assets/sass/app.scss index 63633fc..42fa070 100644 --- a/resources/assets/sass/app.scss +++ b/resources/assets/sass/app.scss @@ -1,9 +1,8 @@ - -// Fonts -@import url("https://fonts.googleapis.com/css?family=Raleway:300,400,600"); - -// Variables -@import "variables"; - // Bootstrap -@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; +@import "~bootstrap/scss/bootstrap"; + +// Open Iconic +@import "~open-iconic/font/css/open-iconic-bootstrap"; + +// Legacy app styles +@import "tissue.css"; \ No newline at end of file diff --git a/public/css/tissue.css b/resources/assets/sass/tissue.css similarity index 100% rename from public/css/tissue.css rename to resources/assets/sass/tissue.css diff --git a/webpack.mix.js b/webpack.mix.js index 72fdbb1..bd34d84 100644 --- a/webpack.mix.js +++ b/webpack.mix.js @@ -12,4 +12,7 @@ let mix = require('laravel-mix'); */ mix.js('resources/assets/js/app.js', 'public/js') - .sass('resources/assets/sass/app.scss', 'public/css'); + .sass('resources/assets/sass/app.scss', 'public/css') + .autoload({ + 'jquery': ['$', 'jQuery', 'window.jQuery'] + }); \ No newline at end of file