在laravel/vuejs2项目中添加普通自定义css文件
我正在使用laravel5.4和vuejs2来构建一个小项目。我刚刚开始与laravel学习vuejs2。使用laravel mix编译我的资产。在LaravelMix文档中,我似乎找不到一种方法来添加我自己要合并和观看的普通css文件 我在public/css/custome.css文件中有自己的css规则。我应该在webpack.mix.js文件中写些什么,这样我的这个文件就会被laravel mix收录并观看?目前,我在文件中有以下行:在laravel/vuejs2项目中添加普通自定义css文件,vuejs2,laravel-5.4,laravel-mix,Vuejs2,Laravel 5.4,Laravel Mix,我正在使用laravel5.4和vuejs2来构建一个小项目。我刚刚开始与laravel学习vuejs2。使用laravel mix编译我的资产。在LaravelMix文档中,我似乎找不到一种方法来添加我自己要合并和观看的普通css文件 我在public/css/custome.css文件中有自己的css规则。我应该在webpack.mix.js文件中写些什么,这样我的这个文件就会被laravel mix收录并观看?目前,我在文件中有以下行: mix.js('resources/assets/j
mix.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css');
将自定义CSS文件移动到
resources/CSS
文件夹中,并在webpack.mix.js
注意:resources
中可能没有css
文件夹,所以只需创建一个
我在上找到了一个解决方案,它对我有效
以下是步骤:
/* importing _custome.scss from the same directory containing the following files
resources/assets/sass/{app.scss, _custome.scss, _variables.scss} */
// import _custome.scss
@import "custome";
// import _variables.scss (custom variables for bootstrap-sass)
@import "variables";
// importing bootstrap-sass from node modules (if you are using bootstrap)
@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";
mix.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css');
npm run dev
仅此而已。这不起作用。我得到一个错误,mix.combine需要一个文件名的完整路径作为最后一个参数,而我们只提供了一个文件夹名(public/css)。另外,我可以知道你的
laravel mix
软件包的版本吗?你好,Ru,我已经试过了。它所做的是告诉项目将一些简单的css文件组合成1-比如mycss.css,。然而,我的问题是如何告诉项目编译这个mycss.css文件并将其添加到webpack监视的中心css文件**(public/css/app.css)**中,这样我就不必在单独的选项卡中的应用程序标题部分明确引用这个文件。我希望我能够澄清我的问题?顺便说一句,我的mix版本:“laravel mix”:“^1.0”请注意,如果要这样做,您需要确保css文件“加载/编译”的顺序正确,否则自定义css将无效,尤其是在覆盖引导样式的情况下。这很有帮助。为我工作
npm run dev