2 posts tagged with "stylelint"

module.exports = {
  root: true,
  env: {
    browser: true,
    es2021: true,
    node: true,
    jest: true,
  },
  extends: [
    "eslint:recommended",
    "plugin:react/recommended",
    "plugin:react-hooks/recommended",
    "plugin:@typescript-eslint/recommended",
  ],
  parser: "@typescript-eslint/parser",
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: "latest",
    sourceType: "module",
  },
  plugins: ["react", "@typescript-eslint"],
  rules: {
    "no-var-requires": 0,
  },
};

module.exports = {
  extends: "stylelint-config-standard",
  customSyntax: "postcss-less",
};

module.exports = {
  extends: ["@commitlint/config-conventional"],
};

const { override, addWebpackAlias } = require("customize-cra");
const path = require("path");

module.exports = {
  webpack: override(
    // 配置alias
    addWebpackAlias({
      ["@"]: path.resolve(__dirname, "src"),
      ["components"]: path.resolve(__dirname, "src/components"),
      ["mock"]: path.resolve(__dirname, "src/mock"),
    })
  ),
};

// config-overrides.js
const { override } = require("customize-cra");
// 需要先安装 yarn add customize-cra-less-loader -D
const addLessLoader = require("customize-cra-less-loader");

module.exports = {
  webpack: override(
    // ...
    // 添加less解析器
    addLessLoader({
      lessOptions: {
        javascriptEnabled: true,
        sourceMap: false,
        // modifyVars: { '@primary-color': '#1DA57A' },
      },
    })
  ),
  // ...
};

declare module '*.less' {
 const content: { [className: string]: string };
 export default content;
}

const { override, adjustStyleLoaders } = require("customize-cra");

module.exports = {
  webpack: override(
    //...
    adjustStyleLoaders((rule) => {
      if (rule.test.toString().includes("less")) {
        rule.use.push({
          loader: "style-resources-loader",
          options: {
            patterns: path.resolve(__dirname, "src/styles/global.less"),
            injector: "append",
          },
        });
      }
    })
  ),
};

// config-overrides.js
const chalk = require('chalk');
const ProgressBarPlugin = require('progress-bar-webpack-plugin');
// ...
module.exports = {
  webpack: override(
    // ...
    addWebpackPlugin(
      new ProgressBarPlugin({
      format: `  :msg [:bar] ${chalk.green.bold(':percent')} (:elapsed s)`,
    }),
  ),
}

// config-overrides.js
const path = require("path");
const exec = require("child_process").execSync;

process.env.REACT_APP_NAME = require("./package.json").name;
process.env.REACT_APP_VERSION = require("./package.json").version;
process.env.REACT_APP_BUILD_TIME = new Date().toLocaleString("zh-CN", {
  hour12: false,
});
process.env.REACT_APP_GIT_COMMIT = exec('git rev-parse --short=8 HEAD')
  .toString()
  .trim();

// helper/utils/index.ts
/**
 * 显示项目配置信息，比如项目名、版本等
 */
export function showProjectInfo() {
  log.capsule(
    `${process.env.REACT_APP_NAME}`,
    `v${process.env.REACT_APP_VERSION}`
  );
  log.primary(`Build Time:  ${process.env.REACT_APP_BUILD_TIME}`);
  log.primary(`Last Commit: ${process.env.REACT_APP_GIT_COMMIT}`);
}

// config-overrides.js
const BundleAnalyzerPlugin =
  require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
// ...
  addWebpackPlugin(
    // ...
    new BundleAnalyzerPlugin(),
  ),

import { createContext } from "react";
import { makeAutoObservable } from "mobx";

// NOTE 如果要限制，得先确保所有代码只通过 action 修改 store 属性
// 否则渲染过程有打印 warning log，会造成一定的性能损耗
// configure({ enforceActions: "always" });

// Model the application state.
class CommonStore {
  count = 0;
  constructor() {
    makeAutoObservable(this);
  }
  add = () => {
    this.count++;
  };
  reduce = () => {
    this.count--;
  };
  get getCount() {
    return "count is " + this.count;
  }
}
export const commonStore = new CommonStore();
export const rootStore = {
  commonStore,
};

export const storeContext = createContext(rootStore);
export const StoreProvider = storeContext.Provider;

const {
  override,
  addDecoratorsLegacy,
  disableEsLint,
  //...
} = require("customize-cra");

module.exports = {
  webpack: override(
    addDecoratorsLegacy(),
    disableEsLint()
    //...
  ),
};

// helper/utils/service.ts
import axios from "axios";
import { envConfig } from "@/config";

export const service = axios.create({
  baseURL: envConfig.baseUrl,
  timeout: 100000,
});

// Add a request interceptor
service.interceptors.request.use(
  function (config) {
    // Do something before request is sent
    return config;
  },
  function (error) {
    // Do something with request error
    return Promise.reject(error);
  }
);

// Add a response interceptor
service.interceptors.response.use(
  function (response) {
    // Any status code that lie within the range of 2xx cause this function to trigger
    // Do something with response data
    return response;
  },
  function (error) {
    // Any status codes that falls outside the range of 2xx cause this function to trigger
    // Do something with response error
    return Promise.reject(error);
  }
);

// services/index.ts
import { service } from "@/helper/utils/service.ts";

export async function getUserList(): Promise<IUserData[]> {
  const res = await service.get("xxx");
  if (res.code !== 200) {
    message.error(`message: ${res.msg}, error: ${res.errorMsg}`, 2.5);
    return;
  }
  // NOTE obj2CamelCase 用于转换下划线为驼峰命名，因为前端统一使用驼峰命名
  return obj2CamelCase(res.data) as IUserData[];
}

import { getUserList } from "./services/index.ts";
// 获取用户列表
const { data } = useRequest(getUserList, {
  manual: false,
  onSuccess: (data) => {
    //...
  },
});

import * as Sentry from "@sentry/react";
import { Integrations } from "@sentry/tracing";

Sentry.init({
  dsn: "xxx", // TODO 这个需要在 sentry 中注册后获取，create project 时注意选择 react 应用
  integrations: [new Integrations.BrowserTracing()],

  // 我们建议在生产中调整此值，或使用 tracesSampler 进行更精细的控制
  tracesSampleRate: 1.0,
});

const Koa = require("koa");
const router = require("koa-router")();
const bodyParser = require("koa-bodyparser");
const testData = require("./test.js");

const app = new Koa();
app.use(bodyParser());
app.use(router.routes());

router.get("/test", async (ctx, next) => {
  ctx.body = testData;
  await next();
});

// error-handling
app.on("error", (err, ctx) => {
  console.error("server error", err, ctx);
});

app.listen(3001);

const Mock = require("mockjs");

const data = Mock.mock({
  "list|1-10": [
    {
      "id|+1": 1,
    },
  ],
});

module.exports = data;

module.exports = {
  root: true,
  env: {
    browser: true,
    es2021: true,
    node: true,
    jest: true,
  },
  extends: [
    "eslint:recommended",
    "plugin:react/recommended",
    "plugin:react-hooks/recommended",
    "plugin:@typescript-eslint/recommended",
  ],
  parser: "@typescript-eslint/parser",
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: "latest",
    sourceType: "module",
  },
  plugins: ["react", "@typescript-eslint"],
  rules: {
    "no-var-requires": 0,
  },
};

module.exports = {
  extends: "stylelint-config-standard",
  rules: {}, // 自定义规则
};

module.exports = {
  printWidth: 160, //编辑器每行的长度，默认80
  tabWidth: 4, //制表符tab的宽度，默认值是2
  useTabs: false, //代码缩进是否用制表符tab，默认false
  semi: true, //是否使用分号，默认true，使用分号
  singleQuote: true, //是否使用单引号，默认为false
  quoteProps: "as-needed", //对象属性的引号使用 as-needed 仅在需要的时候使用 consistent 有一个属性需要引号，就都需要引号 preserve 保留用户输入的情况
  jsxSingleQuote: false,
  trailingComma: "none", //末尾逗号 none 末尾没有逗号 es5 es5有效的地方保留 all 在可能的地方都加上逗号
  bracketSpacing: true, //字面量对象括号中的空格，默认true true - Example: { foo: bar }.  false - Example: {foo: bar}.
  jsxBracketSameLine: false,
  arrowParens: "avoid", //箭头函数中的括号always avoid
  htmlWhitespaceSensitivity: "ignore",
  vueIndentScriptAndStyle: false, //是否给vue中的 <script> and <style>标签加缩进
  endOfLine: "auto", //行末尾标识
  eslintIntegration: true, //不让prettier使用eslint的代码格式进行校验
};

module.exports = {
  extends: ["@commitlint/config-conventional"],
  rules: {}, // 自定义规则
};