// [!] Error: Unexpected token (Note that you need plugins to import files that are not JavaScript) // src/vue/ItemPrice.vue?vue&type=script&lang.ts (35:13) // TODO 官方提供ts插件在vue模版中使用ts语言时报错 // import typescript from "@rollup/plugin-typescript"; // TODO 在rollup watch模式中不更新vue模版ts部分代码 import typescript2 from "rollup-plugin-typescript2"; import json from "@rollup/plugin-json"; import html from "rollup-plugin-string-html"; import resolve from "@rollup/plugin-node-resolve"; import replace from "@rollup/plugin-replace"; import alias from "@rollup/plugin-alias"; import vue from "@vitejs/plugin-vue"; import styles from "rollup-plugin-styles"; import { customInjector } from "./custom-injector.js"; import terser from "@rollup/plugin-terser"; import clone from "just-clone"; import commonjs from '@rollup/plugin-commonjs'; import AutoImport from 'unplugin-auto-import/vite' import Components from 'unplugin-vue-components/vite' // import { VantResolver } from 'unplugin-vue-components/resolvers'; import { ElementPlusResolver } from "unplugin-vue-components/resolvers"; import IconsResolver from 'unplugin-icons/resolver'; import Icons from 'unplugin-icons/vite' import ElementPlus from 'unplugin-element-plus/rollup' let node_env = process.env.NODE_ENV; let vuePath = node_env === 'production' ? 'vue/dist/vue.runtime.esm-browser.prod.js' : 'vue/dist/vue.runtime.esm-browser.js'; const devConfig = { input: 'src/ts/index.ts', output: { file: 'dist/bundle.js', format: 'iife', name: 'bundle.js', }, plugins: [ json(), html({ include: ["**/*.html"], minifier: { includeAutoGeneratedTags: true, removeAttributeQuotes: false, removeComments: true, removeRedundantAttributes: false, removeScriptTypeAttributes: true, removeStyleLinkTypeAttributes: true, sortClassName: true, useShortDoctype: true, collapseWhitespace: true, minifyCSS: true, } }), // 根据环境更改vue源 alias({ entries: [ { find: 'vue', replacement: vuePath }, ] }), // 为vue替换环境变量 replace({ values: { 'process.env.NODE_ENV': () => JSON.stringify(node_env), '__VUE_OPTIONS_API__': () => JSON.stringify(false), '__VUE_PROD_DEVTOOLS__': () => JSON.stringify(true), }, preventAssignment: true, }), // 引入node相关方法 resolve({ browser: true, preferBuiltins: false, }), commonjs(), vue({ isProduction: node_env === 'production' }), AutoImport({ resolvers: [ ElementPlusResolver(), IconsResolver({ prefix: 'Icon', }), ], }), Components({ resolvers: [ IconsResolver({ enabledCollections: ['ep'], }), ElementPlusResolver() ], // resolvers: [VantResolver()], }), Icons(), ElementPlus(), // 自定义注入器注入vue部分css styles({ // modules: true, // namedExports: true, exclude: /static\/css\/.+\.css/, mode: [ "inject", (varName) => customInjector(varName), ], minimize: true }), // 非vue部分css逻辑代码中手动注入 styles({ include: /static\/css\/.+\.css/, // modules: true, // namedExports: true, mode: [ "inject", () => ``, ], minimize: true }), typescript2({ tsconfig: "./tsconfig.json", }), ], }; const prodConfig = clone(devConfig); prodConfig.plugins.push(terser()); prodConfig.output.file = 'dist/bundle.min.js'; prodConfig.output.name = 'bundle.min.js'; export default [devConfig, prodConfig]; export { prodConfig };