根据我的知识和提交历史,我的大型nuxt项目突然停止了能够构建或运行dev的工作,没有任何影响构建过程的事情发生了改变。
但是,每次我尝试构建或运行时,都会收到此错误:
During npm run dev:
Error: Conflict: Multiple assets emit to the same filename (filepath)/(filename).png
During npm build
Error: Conflict: Multiple assets emit to the same filename (img/[hash:7]).png
()替换为文件名
一旦我对每个require(image.png)和url(image.png)进行注释,此错误就会消失,但这并不是我的问题的答案。
我也尝试注释掉响应式加载器,构建extend(),但无济于事。下面是我的nuxt.config.js和我的package.json
This is my Nuxt.config.js
const pkg = require('./package')
const webpack = require('webpack')
require('dotenv').config()
module.exports = {
mode: 'universal',
/*
** Customize the progress-bar color
*/
loading: {
color: '#af9bd0',
height: '3px',
continuous: true
},
generate: {
routes: [
'/ads.txt',
]
},
/*
** Global CSS
*/
css: [
'element-ui/lib/theme-chalk/index.css',
'swiper/dist/css/swiper.css',
"assets/css/index.css",
"assets/css/main.scss",
'vue-loaders/dist/vue-loaders.css'
],
/*
** Plugins to load before mounting the App
*/
/*
** Nuxt.js modules
*/
modules: [
['@nuxtjs/vuetify', {
treeShake: true
}],
'@nuxtjs/pwa',
'@nuxtjs/device',
'nuxt-webfontloader',
'@nuxtjs/axios',
'@nuxtjs/dotenv',
'@nuxtjs/svg-sprite',
'@nuxtjs/style-resources',
['nuxt-validate', {
lang: 'ja',
}],
['@nuxtjs/robots', {
UserAgent: '*',
Disallow: '/',
UserAgent: 'Googlebot',
Disallow: '',
UserAgent: 'Yahoo-slurp',
Disallow: '',
UserAgent: 'Msnbot',
Disallow: ''
}],
['@nuxtjs/moment', {
locales: ['ja'],
defaultLocale: 'ja'
}],
['@nuxtjs/component-cache', {
max: 10000,
maxAge: 1000 * 60 * 60
}],
['@nuxtjs/google-adsense', {
id: process.env.GOOGLE_ADSENSE_ID,
pageLevelAds: false,
test: true,
}],
'@nuxtjs/axios',
['nuxt-fontawesome', {
component: 'fa',
imports: [{
set: '@fortawesome/free-solid-svg-icons',
icons: ['fas']
}, {
set: '@fortawesome/free-regular-svg-icons',
icons: ['far']
}, {
set: '@fortawesome/free-brands-svg-icons',
icons: ['fab']
}]
}],
['@nuxtjs/google-analytics', {
id: process.env.GOOGLE_ANALYTIC_ID,
autoTracking: {
page: true
}
}],
['@nuxtjs/universal-storage', {
storage: {
vuex: true, // boolean or {namespace}
localStorage: true, // boolean or {prefix }
cookie: true, // boolean or {prefix, options }
initialState: {}, // Object {}
ignoreExceptions: true //
}
}],
['@nuxtjs/dotenv', {
/* module options */
}],
['@nuxtjs/recaptcha', {
siteKey: process.env.RECAPTCHA_KEY,
version: 2,
language: 'ja',
hideBadge: true
}],
['@nuxtjs/toast', {
position: 'top-right',
duration: 5000
}],
['nuxt-stripe-module', {
publishableKey: process.env.STRIPE_KEY,
version: 'v3', // Default
}],
"nuxt-compress",
],
axios: {
// baseURL: process.env.SERVER_URL + '/v1',
proxy: true
},
proxy: {
'/v2': {
target: process.env.NEST_SERVER_URL,
changeOrigin: true,
pathRewrite: {
'^/v2': ''
}
},
'/v1': {
target: process.env.SERVER_URL,
changeOrigin: true,
pathRewrite: {
'^/v1/': ''
}
}
},
router: {
middleware: ['auth'],
linkActiveClass: 'active-link'
},
/*
** Build configuration
*/
build: {
/*
** You can extend webpack config here
*/
analyze: true,
splitChunks: {
// name: true,
// layouts: true,
},
optimization: {
splitChunks: {
name: true
}
}
filenames: {
img: ({
isDev
}) => isDev ? '[path][name].[ext]' : 'img/[hash:8].[ext]',
},
extend(config, ctx) {
config.module.rules.unshift({
test: /\.(png|jpe?g|gif)$/,
use: {
loader: 'responsive-loader',
options: {
// disable: isDev,
placeholder: true,
quality: 85,
placeholderSize: 30,
name: 'img/[name].[hash:hex:7].[width].[ext]',
adapter: require('responsive-loader/sharp'),
}
}
})
// remove old pattern from the older loader
config.module.rules.forEach(value => {
if (Array.isArray(value.use)) {
value.use.forEach(u => {
if (u.loader === 'css-loader' && u.options) {
// delete u.options.minimize;
}
});
}
if (String(value.test) === String(/\.(png|jpe?g|gif|svg|webp)$/)) {
// reduce to svg and webp, as other images are handled above
// value.test = /\.(svg|webp)$/
// keep the configuration from image-webpack-loader here unchanged
}
})
},
extractCSS: true,
styleResources: {
sass: ['./assets/css/abstracts/main.scss']
},
transpile: ['vue-clamp', 'resize-detector', 'lodash-es'],
postcss: {
plugins: [
require('postcss-gap-properties')(),
require('autoprefixer')({
grid: true,
flexbox: true,
stats: {
warnings: false
}
})
]
},
// plugins: [new webpack.ProvidePlugin({
// $: 'jquery',
// jQuery: 'jquery',
// 'window.jQuery': 'jquery'
// })]
},
server: {
port: 8080,
host: '0.0.0.0'
},
}
package.json
{
"name": "dafsdaf",
"version": "1.0.0",
"description": "",
"author": "",
"private": true,
"scripts": {
"dev": "NUXT_HOST=0.0.0.0 NUXT_PORT=3333 nuxt",
"build": "nuxt build",
"start": "nuxt start",
"generate": "nuxt generate",
"devHttps": "node server/index.js"
},
"dependencies": {
"@clampy-js/vue-clampy": "^1.0.6",
"@fortawesome/free-brands-svg-icons": "^5.10.2",
"@fortawesome/free-regular-svg-icons": "^5.10.2",
"@fortawesome/free-solid-svg-icons": "^5.10.2",
"@nuxtjs/auth": "^4.8.1",
"@nuxtjs/axios": "^5.6.0",
"@nuxtjs/component-cache": "^1.1.5",
"@nuxtjs/device": "^1.2.3",
"@nuxtjs/dotenv": "^1.4.0",
"@nuxtjs/google-adsense": "^1.1.3",
"@nuxtjs/google-analytics": "^2.2.0",
"@nuxtjs/moment": "^1.2.0",
"@nuxtjs/proxy": "^1.3.3",
"@nuxtjs/pwa": "^2.6.0",
"@nuxtjs/recaptcha": "^0.5.3",
"@nuxtjs/robots": "^2.4.0",
"@nuxtjs/style-resources": "^0.1.2",
"@nuxtjs/svg-sprite": "^0.2.1",
"@nuxtjs/toast": "^3.2.1",
"@nuxtjs/universal-storage": "^0.4.0",
"@nuxtjs/vuetify": "^0.5.7",
"@sum.cumo/nuxt-styleguide": "^5.3.0",
"atob": "^2.1.2",
"axios": "^0.19.0",
"browser-image-resizer": "^2.0.1",
"browserslist": "^4.6.6",
"caniuse-lite": "^1.0.30000989",
"cookie": "^0.3.1",
"cookie-parser": "^1.4.4",
"cross-env": "^5.2.0",
"echarts": "^4.2.1",
"element-ui": "^2.11.1",
"epic-spinners": "^1.1.0",
"fstream": "^1.0.12",
"intersection-observer": "^0.5.1",
"js-yaml": "^3.13.1",
"jwt-decode": "^2.2.0",
"lodash-es": "^4.17.15",
"mixin-deep": "^2.0.1",
"moment": "^2.24.0",
"nuxt": "^2.9.1",
"nuxt-compress": "^1.0.2",
"nuxt-fontawesome": "^0.4.0",
"nuxt-purgecss": "^0.2.1",
"nuxt-stripe-module": "^2.0.0",
"nuxt-validate": "^0.1.3",
"nuxt-webfontloader": "^1.1.0",
"set-value": "^2.0.1",
"swiper": "^4.5.0",
"tar": "^4.4.10",
"tb-skeleton": "^0.3.6",
"uuid": "^3.3.3",
"v-charts": "^1.19.0",
"v-click-outside-x": "^3.7.1",
"vee-validate": "^2.2.15",
"vue": "^2.6.10",
"vue-awesome-swiper": "^3.1.3",
"vue-clamp": "^0.2.1",
"vue-count-to": "^1.0.13",
"vue-croppa": "^1.3.8",
"vue-infinite-loading": "^2.4.4",
"vue-lazy-hydration": "^1.0.0-beta.9",
"vue-line-clamp": "^1.3.2",
"vue-loaders": "^2.0.0",
"vue-match-media": "^1.0.3",
"vue-observe-visibility": "^0.4.4",
"vue-pwa-installer": "^0.2.0",
"vue-scrollama": "^1.1.1",
"vue-swipe-tab": "^2.0.4",
"vue-template-compiler": "^2.6.10",
"vue-text-dot": "^1.0.0",
"vue-the-mask": "^0.11.1",
"vue-tiny-lazyload-img": "^0.1.0",
"vue-zondicons": "^0.1.10",
"vue2-datepicker": "^2.12.0",
"vue2-touch-events": "^1.1.2",
"vuetify-loader": "^1.3.0",
"vuetify-upload-button": "^1.2.2"
},
"devDependencies": {
"autoprefixer": "^9.6.1",
"css-loader": "^3.2.0",
"moment-locales-webpack-plugin": "^1.1.0",
"node-sass": "^4.12.0",
"nodemon": "^1.19.1",
"postcss-gap-properties": "^2.0.0",
"responsive-loader": "^1.2.0",
"sass-loader": "^7.3.1",
"sharp": "^0.23.0",
"style-loader": "^0.23.1",
"stylus": "^0.54.7",
"stylus-loader": "^3.0.2"
}
}