[英]vite.config.js rollupOptions leads to "Unexpected token" error during build
I am currently trying to switch my laravel project from laravel-mix to something like Vitejs.我目前正在尝试将我的 laravel 项目从 laravel-mix 切换到 Vitejs 之类的项目。 I followed the tutorial available here: https://owenconti.com/posts/replacing-laravel-mix-with-vite .
我遵循了此处提供的教程: https://owenconti.com/posts/replacing-laravel-mix-with-vite 。 Any help with this would be truly appreciated.
对此的任何帮助将不胜感激。 Thanks!
谢谢!
When trying to run npm run production I'm getting the following error:尝试运行npm run production时出现以下错误:
Unexpected token
file: /Users/celsoluiz81/Sites/batatolandia/node_modules/vite/dist/node/chunks/dep-971d9e33.js:56066:60
56064: const pendingModules = new Map();
56065: const pendingImports = new Map();
56066: async function ssrLoadModule(url, server, context = { global }, urlStack = []) {
^
56067: url = unwrapId$1(url).replace(NULL_BYTE_PLACEHOLDER, '\0');
56068: // when we instantiate multiple dependency modules in parallel, they may
error during build:
Error: Unexpected token
at error (/Users/celsoluiz81/Sites/batatolandia/node_modules/rollup/dist/shared/rollup.js:159:30)
at Module.error (/Users/celsoluiz81/Sites/batatolandia/node_modules/rollup/dist/shared/rollup.js:12437:16)
at Module.tryParse (/Users/celsoluiz81/Sites/batatolandia/node_modules/rollup/dist/shared/rollup.js:12813:25)
at Module.setSource (/Users/celsoluiz81/Sites/batatolandia/node_modules/rollup/dist/shared/rollup.js:12716:24)
at ModuleLoader.addModuleSource (/Users/celsoluiz81/Sites/batatolandia/node_modules/rollup/dist/shared/rollup.js:22191:20)
[!] Error: unfinished hook action(s) on exit:
(commonjs) load "\u0000/Users/celsoluiz81/Sites/batatolandia/node_modules/vite/dist/node/chunks/dep-971d9e33.js?commonjs-proxy"
After some digging around, I was able to isolate the error to this line in my vite.config.js, more specifically the rollupOptions part:经过一番挖掘,我能够在我的 vite.config.js 中将错误隔离到这一行,更具体地说是 rollupOptions 部分:
build: {
outDir: resolve(__dirname, 'public/dist'),
emptyOutDir: true,
manifest: true,
target: 'es2018',
rollupOptions: {
input: '/js/app.js'
}
},
When I remove the rollupOptions sections, I am able to compile successfully.当我删除 rollupOptions 部分时,我能够成功编译。
import vue from '@vitejs/plugin-vue';
const { resolve } = require('path');
const Dotenv = require('dotenv');
Dotenv.config();
const ASSET_URL = process.env.ASSET_URL || '';
export default {
plugins: [
vue(),
],
root: 'resources',
base: `${ASSET_URL}/dist/`,
server: {
strictPort: true,
port: 3000
},
build: {
outDir: resolve(__dirname, 'public/dist'),
emptyOutDir: true,
manifest: true,
target: 'es2018',
rollupOptions: {
input: '/js/app.js'
}
},
resolve: {
alias: {
'@': '/js',
}
},
optimizeDeps: {
include: [
'vue',
'axios'
]
}
}
import 'vite/modulepreload-polyfill'
import './bootstrap';
/**
* Vue
*/
import VueApp from './modules/main.module';
if (document.getElementById('app')) {
VueApp();
}
Make sure that you are loading the generated module with type="module"
, ie确保您正在使用
type="module"
加载生成的模块,即
Instead of:代替:
<script src="/static/assets/index.f551f06e.js"></script>
It should be:它应该是:
<script type="module" src="/static/assets/index.f551f06e.js"></script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.