未捕获的 ReferenceError：使用 VuePress 时未定义进程

问题描述

我正在尝试为我的组件库创建文档，当我尝试让 VuePress 在开发中运行时遇到了 Uncaught ReferenceError: process is not defined。我不知道如何解决这个问题。

这个库是使用 vue-sfc-rollup

搭建的

// enhanceApp.js
import ComponentLibrary from './../../src/entry.js'

export default ({ Vue,options,router,siteData }) => {
    Vue.use(ComponentLibrary)
}

// entry.js
// Import vue components
import * as components from '@/lib-components/index';

// install function executed by Vue.use()
const install = function installVueCharge(Vue) {
  if (install.installed) return;
  install.installed = true;
  Object.entries(components).forEach(([componentName,component]) => {
    Vue.component(componentName,component);
  });
};

// Create module deFinition for Vue.use()
const plugin = {
  install,};

// To auto-install on non-es builds,when vue is found
// eslint-disable-next-line no-redeclare
/* global window,global */
if ('false' === process.env.ES_BUILD) {
  let GlobalVue = null;
  if (typeof window !== 'undefined') {
    GlobalVue = window.Vue;
  } else if (typeof global !== 'undefined') {
    GlobalVue = global.Vue;
  }
  if (GlobalVue) {
    GlobalVue.use(plugin);
  }
}
// Default export is library as a whole,registered via Vue.use()
export default plugin;

// To allow individual component use,export components
// each can be registered via Vue.component()
export * from '@/lib-components/index';

编辑：我添加了我的 rollup.config.js，因为这是定义 process.env.ES_BUILD 的地方。

// rollup.config.js
import fs from 'fs';
import path from 'path';
import vue from 'rollup-plugin-vue';
import alias from '@rollup/plugin-alias';
import commonjs from '@rollup/plugin-commonjs';
import replace from '@rollup/plugin-replace';
import babel from 'rollup-plugin-babel';
import { terser } from 'rollup-plugin-terser';
import minimist from 'minimist';

// Get browserslist config and remove ie from es build targets
const esbrowserslist = fs.readFileSync('./.browserslistrc')
  .toString()
  .split('\n')
  .filter((entry) => entry && entry.substring(0,2) !== 'ie');

const argv = minimist(process.argv.slice(2));

const projectRoot = path.resolve(__dirname,'..');

const baseConfig = {
  input: 'src/entry.js',plugins: {
    preVue: [
      alias({
        resolve: ['.js','.jsx','.ts','.tsx','.vue'],entries: {
          '@': path.resolve(projectRoot,'src'),},}),],replace: {
      'process.env.NODE_ENV': JSON.stringify('production'),'process.env.ES_BUILD': JSON.stringify('false'),vue: {
      css: true,template: {
        isProduction: true,babel: {
      exclude: 'node_modules/**',extensions: ['.js',};

// ESM/UMD/IIFE shared settings: externals
// Refer to https://rollupjs.org/guide/en/#warning-treating-module-as-external-dependency
const external = [
  // list external dependencies,exactly the way it is written in the import statement.
  // eg. 'jquery'
  'vue',];

// UMD/IIFE shared settings: output.globals
// Refer to https://rollupjs.org/guide/en#output-globals for details
const globals = {
  // Provide global variable names to replace your external imports
  // eg. jquery: '$'
  vue: 'Vue',};

// Customize configs for individual targets
const buildFormats = [];
if (!argv.format || argv.format === 'es') {
  const esConfig = {
    ...baseConfig,external,output: {
      file: 'dist/vue-charge.esm.js',format: 'esm',exports: 'named',plugins: [
      replace({
        ...baseConfig.plugins.replace,'process.env.ES_BUILD': JSON.stringify('true'),...baseConfig.plugins.preVue,vue(baseConfig.plugins.vue),babel({
        ...baseConfig.plugins.babel,presets: [
          [
            '@babel/preset-env',{
              targets: esbrowserslist,commonjs(),};
  buildFormats.push(esConfig);
}

if (!argv.format || argv.format === 'cjs') {
  const umdConfig = {
    ...baseConfig,output: {
      compact: true,file: 'dist/vue-charge.ssr.js',format: 'cjs',name: 'VueCharge',globals,plugins: [
      replace(baseConfig.plugins.replace),vue({
        ...baseConfig.plugins.vue,template: {
          ...baseConfig.plugins.vue.template,optimizeSSR: true,babel(baseConfig.plugins.babel),};
  buildFormats.push(umdConfig);
}

if (!argv.format || argv.format === 'iife') {
  const unpkgConfig = {
    ...baseConfig,file: 'dist/vue-charge.min.js',format: 'iife',terser({
        output: {
          ecma: 5,};
  buildFormats.push(unpkgConfig);
}

// Export config
export default buildFormats;

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）