将顺风css构建为公共站点，并作为管理仪表板进行验证
将顺风css构建为公共站点，并作为管理仪表板进行验证
提问于 2020-09-29 11:49:36
我试图建立一个网站与顺风css和独立的javascript与app.js的主网站和admin.js管理仪表板，以减少大小。我使用的是带有代码拆分的laravel-mix。这是我当前的配置：
const mix = require('laravel-mix');
const path = require('path');
require('vuetifyjs-mix-extension')
/*
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel applications. By default, we are compiling the CSS
| file for the application as well as bundling up all the JS files.
|
*/
mix.js('resources/js/app.js', 'public/js')
.postCss('resources/css/app.css', 'public/css', [
require('postcss-import'),
require('tailwindcss'),
])
.babelConfig({
plugins: ['@babel/plugin-syntax-dynamic-import'],
})
.webpackConfig({
output: {
chunkFilename: 'js/[name].js',
},
resolve: {
alias: {
ziggy: path.resolve('vendor/tightenco/ziggy/src/js/route.js'),
},
},
});
mix.js('resources/js/admin.js', 'public/js')
.vuetify('vuetify-loader');
if(mix.inProduction()) {
mix.version()
.webpackConfig({
output: {
chunkFilename: 'js/[name].js?id=[chunkhash]',
}
});
} else {
mix.sourceMaps();
}此配置的问题在于，由于某些原因，编译后的app.css为空：
DONE Compiled successfully in 43435ms 10:29:10 AM
Asset Size Chunks Chunk Names
/css/app.css 0 bytes /js/admin, /js/app [emitted] /js/admin, /js/app
/js/admin.js 6.52 MiB /js/admin [emitted] /js/admin
/js/app.js 3.28 MiB /js/app [emitted] /js/app
js/0.js 61.1 KiB 0 [emitted]
js/1.js 76.1 KiB 1 [emitted]
js/10.js 346 KiB 10 [emitted]
js/11.js 283 KiB 11 [emitted]
js/12.js 64.9 KiB 12 [emitted]
js/13.js 82.9 KiB 13 [emitted]
js/14.js 65.5 KiB 14 [emitted]
js/15.js 94.3 KiB 15 [emitted]
js/16.js 78.2 KiB 16 [emitted]
js/17.js 53.2 KiB 17 [emitted]
js/18.js 32.8 KiB 18 [emitted]
js/19.js 15.8 KiB 19 [emitted]
js/2.js 202 KiB 2 [emitted]
js/20.js 15.2 KiB 20 [emitted]
js/21.js 17.8 KiB 21 [emitted]
js/22.js 35.3 KiB 22 [emitted]
js/23.js 40.8 KiB 23 [emitted]
js/24.js 140 KiB 24 [emitted]
js/3.js 74.2 KiB 3 [emitted]
js/4.js 2.01 MiB 4 [emitted]
js/5.js 48.6 KiB 5 [emitted]
js/6.js 118 KiB 6 [emitted]
js/7.js 80.1 KiB 7 [emitted]
js/8.js 55.5 KiB 8 [emitted]
js/9.js 42.2 KiB 9 [emitted]回答 1
Stack Overflow用户
发布于 2020-09-29 12:43:58
我设法基于this github issue解决了这个问题。我只需要将entry添加到我的webpack配置的css文件中，如下所示：
.webpackConfig({
entry: {
main: ['./resources/css/app.css']
},
output: {
chunkFilename: 'js/[name].js',
},
resolve: {
alias: {
ziggy: path.resolve('vendor/tightenco/ziggy/src/js/route.js'),
},
},
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/64112609
复制相关文章
相似问题
腾讯云开发者
