添加 css 以使用 rollup 进行构建

Add css to build using rollup

提问人:Maxqueue 提问时间:11/12/2023 更新时间:11/12/2023 访问量:24

问:

我有故事书项目,我想将 css 文件包含在我的构建中。我所有的 css 文件都在 src/styles 中。

我没有看到我的输出中包含的 css 文件。

这是我的rollup.config.js

import dts from "rollup-plugin-dts";
import esbuild from "rollup-plugin-esbuild";
import postcss from "rollup-plugin-postcss";

const config = [
{
input: "src/index.ts",
output: [
  {
    file: "dist/cjs/index.js",
    format: "cjs",
    sourcemap: true,
  },
  {
    file: "dist/esm/index.js",
    format: "esm",
    sourcemap: true,
  },
],
plugins: [
  esbuild({
    //include: /\.[jt]sx?$/, // default, inferred from `loaders` option
    exclude: /node_modules/, // default
    sourceMap: false, // default
    minify: false,
    target: "esnext", // default, or 'es20XX', 'esnext'
    jsx: "transform", // default, or 'preserve'
    jsxFactory: "React.createElement",
    jsxFragment: "React.Fragment",
    // Like @rollup/plugin-replace
    define: {
      __VERSION__: '"x.y.z"',
    },
    tsconfig: "tsconfig.json", // default
    // Add extra loaders
    loaders: {
      // Add .json files support
      // require @rollup/plugin-commonjs
      ".json": "json",
      // Enable JSX in .js files too
      ".js": "jsx",
    },
  }),
  postcss({
    extensions: [".css"],
    extract: true,
    minimize: true,
    include: ["src/styles/*.css"],
  }),
],
external: ["react"],
},
{
  input: "src/index.ts",
  output: [{ file: "dist/types.d.ts", format: "es" }],
  plugins: [dts()],
},
];

export default config;
CSS ReactJS npm 故事书 汇总

评论


答: 暂无答案