Nuxt 构建不包含node_modules CSS

Question

对不起，我对Nuxt&Webpack。我有一个Nuxt项目，在这个项目中运行yarn dev一切都很好。但当我使用yarn build->yarn generate进行构建时，我在node_modules目录中引用的.css文件(dropzone.css、flatpackr.css等(永远不会被包括在内，也不会破坏网站。我什么都试过了，但不明白我做错了什么。有人能给我指正确的方向吗？目前正在使用Tailwind.css运行Nuxt v2.11.0。这是我的Nuxt.config.js文件，它主要是样板文件-

require('dotenv').config()
export default {
env: {
baseUrl: process.env.BASE_URL || '/',
apiUrl: process.env.API_URL
},
mode: 'universal',
css: [
'@/assets/css/tailwind.css',
'@/assets/fonts/caslongraphique/webfont.css',
'@/assets/fonts/turbinadobolddry/font.css',
{ src: 'nuxt-dropzone/dropzone.css', lang: 'css' },
{ src: 'vue-agile/dist/VueAgile.css', lang: 'css' },
{ src: 'flatpickr/dist/flatpickr.css', lang: 'css' },
{ src: 'flatpickr/dist/themes/airbnb.css', lang: 'css' }
],
/*
** Plugins to load before mounting the App
*/
plugins: [
{ src: '~plugins/helpers' },
{ src: '~plugins/vue-moment' },
{ src: '~plugins/vue-agile', mode: 'client' },
{ src: '~plugins/eventBus', mode: 'client' },
{ src: '~plugins/axios', mode: 'client' },
{ src: '~plugins/vuex-persist', mode: 'client' }
],
buildModules: [
// Doc: https://github.com/nuxt-community/nuxt-tailwindcss
'@nuxtjs/tailwindcss',
],
modules: [
'@nuxtjs/axios',
'@nuxtjs/dotenv',
// 'nuxt-client-init-module'
],
build: {
/*
** You can extend webpack config here
*/
extend (config, ctx) {
},
postcss: {
plugins: {
// Disable a plugin by passing false as value
'postcss-url': false,
'postcss-nested': {},
'autoprefixer': true
},
preset: {
// Change the postcss-preset-env settings
autoprefixer: {
grid: true
}
}
},
}
}

Answer 1

如果没有完整的项目来构建和运行，很难回答这个问题。我假设您在为生产构建时没有使用单独的webpack配置文件，否则您会将其添加到问题中。您在配置文件中似乎使用了正确的语法，所以我猜您的css文件路径不太正确。它们看起来有点像旧的做事方式，你可能想确认它们没有过时。这个古老的github问题经历了你可以尝试的各种事情，其中之一是让nuxt自动为你找到css的"编译"版本，如下所示：

css: [
'nuxt-dropzone',
...etc
],

尝试删除所有第三方css文件，并在前一个文件工作后一次添加一个。

这个例子来自官方文档：

export default {
css: [
// Load a Node.js module directly (here it's a Sass file)
'bulma',
// CSS file in the project
'@/assets/css/main.css',
// SCSS file in the project
'@/assets/css/main.scss'
]
}