老项目改造,不考虑 vite
核心的 webpack.config.js 差不多是这样写的,但是不知道为啥 esbuid-loader 没有把 js 转译成 es2015
有没有大佬帮忙看看
const { resolve } = require('path')
const { ESBuildPlugin } = require('esbuild-loader')
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const { createTemplatePlugin } = require('./template.plugin.cjs')
const entry = {
app: './src/app.js',
bpp: './src/bpp.js',
}
const templatePlugins = Object.keys(entry).map(it => createTemplatePlugin({
chunks: [it],
filename: `${it}.html`,
}))
const config = {
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
exclude: /node_modules/,
}, {
test: /\.js$/,
use: [{
loader: 'esbuild-loader',
options: {
target: 'es2015'
}
}],
exclude: /node_modules/,
}, {
test: /\.(png|jpg|jpeg|gif)$/,
use: [{ loader: 'file-loader', options: { outputPath: 'assets' } }],
}, {
test: /\.(css|less)$/,
use: [
{ loader: 'style-loader' },
{ loader: 'css-loader' },
{ loader: 'less-loader' },
],
exclude: /node_modules/
}
]
},
resolve: {
extensions: ['.vue', '.js']
},
plugins: [
new VueLoaderPlugin(),
new ESBuildPlugin(),
...templatePlugins,
],
optimization: {
splitChunks: {
chunks: 'all',
automaticNameDelimiter: '_',
},
},
entry,
output: {
filename: '[name].[chunkhash].js',
chunkFilename: '[name].[chunkhash].js',
path: resolve(__dirname, 'dist')
},
mode: 'development',
}
module.exports = config
1
zzk1989 2021-01-09 09:19:01 +08:00
vite-for-vue2
vue-rollup-boilerplate 这些用到了 esbuid 的项目都可以考虑,esbuid 引入 element-ui 会报错,可以用 cdn 方式引入 |