init

src/component/container/index.less

@@ -0,0 +1,12 @@
+.layui-container {
+  position: relative;
+  margin: 0 auto;
+  padding: 0 15px;
+  box-sizing: border-box;
+}
+
+.layui-fluid {
+  position: relative;
+  margin: 0 auto;
+  padding: 0 15px;
+}

src/component/container/index.ts

@@ -0,0 +1,5 @@
+import { withInstall, WithInstallType } from "../../utils";
+import Component from "./index.vue";
+
+const component: WithInstallType<typeof Component> = withInstall(Component);
+export default component;

src/component/container/index.vue

@@ -0,0 +1,29 @@
+<script lang="ts">
+export default {
+  name: "LayContainer",
+};
+</script>
+
+<script setup lang="ts">
+import "./index.less";
+import { computed } from "vue";
+import { BooleanOrString } from "../../types";
+
+export interface ContainerProps {
+  fluid?: BooleanOrString;
+}
+
+const props = withDefaults(defineProps<ContainerProps>(), {
+  fluid: false,
+});
+
+const classes = computed(() =>
+  props.fluid ? "layui-fluid" : "layui-container"
+);
+</script>
+
+<template>
+  <div :class="classes">
+    <slot></slot>
+  </div>
+</template>