Php 如何在Laravel上使用带有twitter引导的rtlcss节点包？_Php_Node.js_Laravel_Npm_Rtlcss

Php 如何在Laravel上使用带有twitter引导的rtlcss节点包？

php node.js laravel npm

Php 如何在Laravel上使用带有twitter引导的rtlcss节点包？,php,node.js,laravel,npm,rtlcss,Php,Node.js,Laravel,Npm,Rtlcss,这听起来可能很愚蠢，但我最近开始使用LaravelMix来编译SCS和js文件。但我不明白什么我想使用rtlcss npm来制作twitter引导程序rtl。这是Laravel的默认app.scss资产 // Fonts @import url("https://fonts.googleapis.com/css?family=Raleway:300,400,600"); // Variables @import "variables"; // Bootstrap @import "~bo

这听起来可能很愚蠢，但我最近开始使用LaravelMix来编译SCS和js文件。但我不明白什么

我想使用rtlcss npm来制作twitter引导程序rtl。这是Laravel的默认app.scss资产

// Fonts
@import url("https://fonts.googleapis.com/css?family=Raleway:300,400,600");

// Variables
@import "variables";

// Bootstrap
@import "~bootstrap-sass/assets/stylesheets/bootstrap";

这是默认的app.js资产：

window._ = require('lodash');

try {
    window.$ = window.jQuery = require('jquery');

    require('bootstrap-sass');
} catch (e) {}


window.axios = require('axios');

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';


let token = document.head.querySelector('meta[name="csrf-token"]');

if (token) {
    window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
    console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
}

我已经通过node软件包安装了rtlCSS，现在我想做的是，当我运行npm run dev或watcher时，它会编译引导scss文件并使其成为RTL，并将其放入公共css目录，就像默认LTR一样。

您可以轻松地使用Laravel Mix生成RTL css：

首先，要使用Laravel mix，您应该从npm安装必要的库： npm安装

然后，安装WebpackRTL插件：npm安装WebpackRTL插件-保存开发

然后，在laravel应用程序根目录下的webpack.mix.js中，导入顶部的pulgin：

让WebpackRTLPlugin=require'webpack-rtl-plugin'

然后，更换：

mix.js('resources/assets/js/app.js', 'public/js')
   .sass('resources/assets/sass/app.scss', 'public/css');

以下是：

mix.js('resources/assets/js/app.js', 'public/js')
  .sass('resources/assets/sass/app.scss', 'public/css')
  .webpackConfig({
    plugins: [
      new WebpackRTLPlugin()
    ]
  });

最后，run:npm为develpoment运行dev或npm为生产运行prod

因此，Larave Mix将产生：

public/css/app.css来自sass的原始css

public/css/app.rtl.css rtl css版本

和public/css/app.js

您可以使用Laravel Mix轻松生成RTL css：