Question

根据Google Material Components的文档，我无法找到将其与 Laravel 集成的方法。提到了配置Webpack的步骤，但是我找不到合适的方法将其放入Laravel Mix。

所以问题是如何将Google材料组件（不是精简版）集成到Laravel项目中。

Answer 1

与Laravel Mix相比，材料组件的集成比纯Webpack配置要容易得多。

首先，安装默认的Laravel项目的Node依赖项，并确保已安装node-sass和sass-loader，当然还要添加material-components-web：

npm i
npm i node-sass sass-loader -D
npm i material-components-web -S

然后，假设您在app.js文件夹中有resources/assets/scripts，在app.scss文件夹中有resources/assets/sass，则您的webpack.mix.js应该看起来像这样：

const mix = require('laravel-mix')

mix
.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css', {
  includePaths: ['node_modules']
})

然后，在app.js和app.scss中分别以与MDC Web documentation中所述相同的方式导入ES2015和Sass。

在这里，我描述了如何安装Vanilla JS项目。如果您对Vue.js感兴趣，则可以添加Vue.js wrapper for MDC-Web（Vue MDC适配器）：

npm i vue-mdc-adapter -S

然后，按照Vue MDC Adapter documentation中的说明使用它。

Laravel的材料组件

1 个答案: