Error in chunk columns/index [entry]
columns/index.js
missing external configuration for type:commonjs
when i update webpack version to 4, i get this. i can't find what that means. I excluded the reason why es was downgraded
here is webpack.config.js
const utils = require('./utils')
const CopyWebpackExternalsManifest = require('copy-webpack-externals-manifest')
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const { VueLoaderPlugin } = require('vue-loader')
module.exports = {
entry: utils.entry("./app/src/**/index.js"),
output: utils.output,
plugins: [
...utils.plugins,
new CopyWebpackExternalsManifest({
externals: [{
module: "lodash",
entry: ["lodash.min.js"],
export: {
root: "_",
commonjs2: 'lodash'
}
}, {
module: "jquery",
entry: ["dist/jquery.min.js"],
export: {
root: "$",
commonjs2: 'jquery'
}
}, {
module: "tinymce",
entry: ["tinymce.min.js"],
export: {
root: "tinymce",
commonjs2: 'tinymce'
},
assets: ["plugins", "themes/modern", "skins"]
}, {
module: "plupload",
entry: ["js/plupload.full.min.js"],
export: {
root: "plupload",
commonjs2: 'plupload'
},
assets: ["js/moxie.min.js"]
}, {
module: "moment",
entry: ["min/moment.min.js"],
export: {
root: "moment",
commonjs2: 'moment'
}
}, {
module: "vue",
entry: [utils.vueRuntimeByEnv],
export: {
root: "Vue",
commonjs2: 'vue'
}
}, {
module: "element-ui",
entry: ["lib/index.js", "lib/theme-chalk/index.css"],
export: {
root: "ELEMENT",
commonjs2: 'element-ui'
},
assets: ["lib/theme-chalk/fonts"]
}, {
module: "vue-echarts",
entry: ["dist/vue-echarts.js"],
export: {
root: "VueECharts",
commonjs2: 'vue-echarts'
}
}
]
}),
new VueLoaderPlugin
],
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
rules: [
{
test: /\.css$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader"
]
}, {
test: /\.less/,
use: [
MiniCssExtractPlugin.loader,
"css-loader",
"less-loader"
]
}
],
preserveWhitespace: false,
postcss: [
require('autoprefixer')({
browsers: ['last 5 versions']
})
]
}
},
{
test: /\.js$/,
loader: 'babel-loader'
},
{
test: /\.css$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader"
]
},
{
test: /\.less$/,
use: [
MiniCssExtractPlugin.loader,
"css-loader"
]
},
{
test: /\.(png|jpg|gif|svg|woff|eot|ttf)$/,
loader: 'file-loader',
options: {
name: '[name].[hash:7].[ext]'
}
}
]
}
};
here is the target js:columns/index.js
import Vue from '../constructor';
import index from './index.vue';
new Vue({
el: '#app',
render: h => h(index),
});
i found the reason, i found that i had set the libraryTarget of output in the configuration of wepback
libraryTarget: 'umd'
but in externals
externals: {
lodash: {
commonjs: 'lodash',
commonjs2: 'lodash',
amd: 'lodash',
root: '_'
}
}
i forget set commonjs, so i add commonjs, the problem was solved
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With