vueuse/vue-demi

Packaged a custom hook with rollup, ref did not unpack it automatically in the template

jiangyong1998 opened this issue · 2 comments

image

The following is displayed in devtools

image

rollup.config.js

import path from "path";
import resolve from "@rollup/plugin-node-resolve";
import commonjs from "@rollup/plugin-commonjs";
import rollupTypescript from "rollup-plugin-typescript2";
import babel from "@rollup/plugin-babel";
import { DEFAULT_EXTENSIONS } from "@babel/core";
import { terser } from "rollup-plugin-terser";
import strip from "@rollup/plugin-strip";
import pkg from "./package.json";
const env = process.env.NODE_ENV;

const config = {
  input: path.resolve(__dirname, "src/index.ts"),
  output: [
    {
      file: pkg.main,
      format: "cjs",
    },
    {
      file: pkg.module,
      format: "es",
    },
    {
      name: "jhooks",
      file: pkg.umd,
      format: "umd",
      globals: {
        dayjs: "dayjs",
        lodash: "_",
      },
    },
  ],
  plugins: [
    resolve(),
    commonjs(),
    rollupTypescript(),
    strip(),
    babel({
      exclude: "node_modules/**",
      babelHelpers: "runtime",
      extensions: [...DEFAULT_EXTENSIONS, ".ts"],
    }),
    env === "production" &&
      terser({
        compress: {
          pure_getters: true,
          unsafe: true,
          unsafe_comps: true,
          warnings: false,
        },
      }),
  ],
  external: ["lodash", "dayjs"],
};

export default config;

package.json

{
  "devDependencies": {
    "@babel/core": "^7.22.10",
    "@babel/plugin-proposal-class-properties": "^7.18.6",
    "@babel/plugin-transform-runtime": "^7.22.10",
    "@babel/preset-env": "^7.22.10",
    "@rollup/plugin-babel": "^5.3.1",
    "@rollup/plugin-commonjs": "^21.0.3",
    "@rollup/plugin-node-resolve": "^13.1.3",
    "@rollup/plugin-strip": "^3.0.2",
    "@types/lodash": "^4.14.196",
    "rimraf": "^3.0.2",
    "rollup": "^2.70.1",
    "rollup-plugin-terser": "^7.0.2",
    "rollup-plugin-typescript2": "^0.31.2",
    "typescript": "^4.6.3"
  },
  "dependencies": {
    "@babel/runtime-corejs3": "^7.22.10",
    "vue-demi": "^0.14.5"
  },
  "peerDependencies": {
    "@vue/composition-api": "^1.0.0-beta.1",
    "dayjs": "^1.11.9",
    "lodash": "^4.17.21",
    "vue": "^2.0.0 || >=3.0.0-rc.0"
  },
  "files": [
    "dist"
  ]
}

babel.config.js

module.exports = {
  presets: [
    [
      "@babel/preset-env",
      {
        modules: false,
      },
    ],
  ],
  plugins: [
    "@babel/plugin-proposal-class-properties",
    [
      "@babel/plugin-transform-runtime",
      {
        corejs: 3,
      },
    ],
  ],
  ignore: ["node_modules/**"],
};

antfu commented

We temporarily close this due to the lack of enough information.
Please provide a minimal reproduction to reopen the issue.
Thanks.

Why reproduction is required

We temporarily close this due to the lack of enough information. Please provide a minimal reproduction to reopen the issue. Thanks.

Why reproduction is required

Thank you for your answer. This is a packaged product that I used in the Vue2 project
dist.zip