diff --git a/src/components/genelator/base/Validator.jsx b/src/components/genelator/base/Validator.jsx
index 7d0374f..ed491fb 100644
--- a/src/components/genelator/base/Validator.jsx
+++ b/src/components/genelator/base/Validator.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
import ReactTooltip from 'react-tooltip';
export function Validator(props) {
@@ -7,6 +7,14 @@ export function Validator(props) {
field: { type, validator, openValidator, converter, noSearch },
setField,
} = props;
+ const [isConverter, setIsConverter] = useState(false);
+
+ useEffect(() => {
+ const possibleConverter = ['text', 'textarea', 'checkbox', 'selectbox', 'radioButton'];
+ if (possibleConverter.includes(type)) {
+ setIsConverter(true);
+ }
+ }, [type, setIsConverter]);
const noSearchCheck = () => {
return (
@@ -100,41 +108,46 @@ export function Validator(props) {
{openValidator && (
- {/text|textarea|radio|select/.exec(type) && noSearchCheck()}
-
- テキストの変換
-
-
-
- テキストフィールドに入力された値を別の値に変換します。詳しくは参照ボタンを押すと表示されるモーダルウィンドウに情報が記載されています。
-
-
-
-
- {
- const value = e.target.value;
- if (!value) return;
- setField((prevState) => ({ ...prevState, converter: value }));
- }}
- className="acms-admin-form-width-quarter acms-admin-margin-right-small"
- placeholder="例)rs"
- />
-
-
+ {isConverter && (
+
+ {/text|textarea|radio|select/.exec(type) && noSearchCheck()}
+
+ テキストの変換
+
+
+
+ テキストフィールドに入力された値を別の値に変換します。詳しくは参照ボタンを押すと表示されるモーダルウィンドウに情報が記載されています。
+
+
+
+
+ {
+ const value = e.target.value;
+ if (!value) return;
+ setField((prevState) => ({ ...prevState, converter: value }));
+ }}
+ className="acms-admin-form-width-quarter acms-admin-margin-right-small"
+ placeholder="例)rs"
+ />
+
+
+
+ )}
+
{showValidator && (
diff --git a/webpack.dev.js b/webpack.dev.js
index 368e238..d6fdbba 100644
--- a/webpack.dev.js
+++ b/webpack.dev.js
@@ -8,6 +8,9 @@ module.exports = merge(prodConfig, {
mode: 'development',
devtool: 'inline-source-map',
devServer: {
+ client: {
+ overlay: false,
+ },
static: {
directory: path.resolve(__dirname, ''),
},
diff --git a/webpack.prod.js b/webpack.prod.js
index 5c6bba4..9f3a173 100644
--- a/webpack.prod.js
+++ b/webpack.prod.js
@@ -1,4 +1,3 @@
-// webpack.prod.js
const path = require('path');
const ESLintPlugin = require('eslint-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
@@ -6,11 +5,11 @@ const CopyWebpackPlugin = require('copy-webpack-plugin');
module.exports = {
mode: 'production',
cache: {
- type: 'filesystem', // Webpack 5では推奨される方法
+ type: 'filesystem',
},
performance: {
hints: 'warning',
- maxAssetSize: 600000, // 600 KiBに設定
+ maxAssetSize: 600000,
maxEntrypointSize: 600000,
},
@@ -25,9 +24,9 @@ module.exports = {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js',
chunkFilename: `bundle.chunk.js?date=${new Date().getTime()}`,
- assetModuleFilename: 'assets/[name][ext]', // アセットの出力先を指定
+ assetModuleFilename: 'assets/[name][ext]',
publicPath: '/',
- clean: true, // ビルド時に dist フォルダをクリーンアップ
+ clean: true,
},
resolve: {
modules: ['node_modules'],
@@ -40,6 +39,9 @@ module.exports = {
exclude: /node_modules/,
use: {
loader: 'babel-loader',
+ options: {
+ cacheDirectory: true,
+ },
},
},
{
@@ -48,9 +50,14 @@ module.exports = {
},
{
test: /\.(jpg|png|svg)$/,
- type: 'asset/resource', // Webpack 5 の Asset Modules を使用
+ type: 'asset',
+ parser: {
+ dataUrlCondition: {
+ maxSize: 8 * 1024,
+ },
+ },
generator: {
- filename: 'assets/[name][ext]', // アセットの出力パターンを指定
+ filename: 'assets/[name].[hash][ext]',
},
},
],