Где я могу найти надлежащий документ по переменным preact ejs?

Question

Где я могу найти надлежащий документ по переменным preact ejs?

Я решил перенести свой хобби-проект с реакции на преакт и бороться с документацией. Большая часть информации, которую я получил, была либо из существующих примеров, либо из обсуждений проблем на github.

Но что до сих пор не нашел, так это информацию о переменных ejs, используемых в html-файле шаблона.

Есть ли хорошее объяснение, какие переменные существуют по умолчанию и как ими управлять?

0

javascript ejs preact preact-cli

Источник

user2205002 08 янв '22 в 13:17

1 ответ

Другие вопросы по тегам javascript ejs preact preact-cli

user15388164 09 янв '22 в 06:31 2022-01-09 06:31 · Answer 1 · 2022-01-09 06:31

По умолчанию там не так много пользы, так как вместо этого это метод, позволяющий вам вводить свои собственные значения. Если вы хотите увидеть, что там по умолчанию, вы можете добавить следующее в свой template.html:

      <body>
    <% preact.bodyEnd %>
    <%= JSON.stringify(htmlWebpackPlugin.options) %>
</body>

Вот что выплюнет:

      {
   "template":"!!/home/ryun/Projects/foobar/node_modules/ejs-loader/index.js?esModule=false!/tmp/preact-cli/template.tmp.ejs",
   "filename":"index.html",
   "hash":false,
   "inject":true,
   "compile":true,
   "favicon":"assets/favicon.ico",
   "minify":{
      "collapseWhitespace":true,
      "removeScriptTypeAttributes":true,
      "removeRedundantAttributes":true,
      "removeStyleLinkTypeAttributes":true,
      "removeComments":true
   },
   "cache":true,
   "showErrors":true,
   "chunks":"all",
   "excludeChunks":[
      
   ],
   "chunksSortMode":"auto",
   "meta":{
      
   },
   "title":"Home Page",
   "xhtml":false,
   "url":"/",
   "inlineCss":true,
   "preload":false,
   "manifest":{
      "name":"foobar",
      "short_name":"foobar",
      "start_url":"/",
      "display":"standalone",
      "orientation":"portrait",
      "background_color":"#fff",
      "theme_color":"#673ab8",
      "icons":[
         {
            "src":"/assets/icons/android-chrome-192x192.png",
            "type":"image/png",
            "sizes":"192x192"
         },
         {
            "src":"/assets/icons/android-chrome-512x512.png",
            "type":"image/png",
            "sizes":"512x512"
         }
      ]
   },
   "excludeAssets":[
      {
         
      }
   ],
   "config":{
      "_":[
         
      ],
      "src":"/home/ryun/Projects/foobar/src",
      "dest":"/home/ryun/Projects/foobar/build",
      "cwd":"/home/ryun/Projects/foobar",
      "esm":true,
      "sw":true,
      "babelConfig":".babelrc",
      "preload":false,
      "prerender":true,
      "prerenderUrls":"prerender-urls.json",
      "brotli":false,
      "inline-css":true,
      "config":"preact.config.js",
      "c":"preact.config.js",
      "production":true,
      "isProd":true,
      "isWatch":false,
      "manifest":{
         "name":"foobar",
         "short_name":"foobar",
         "start_url":"/",
         "display":"standalone",
         "orientation":"portrait",
         "background_color":"#fff",
         "theme_color":"#673ab8",
         "icons":[
            {
               "src":"/assets/icons/android-chrome-192x192.png",
               "type":"image/png",
               "sizes":"192x192"
            },
            {
               "src":"/assets/icons/android-chrome-512x512.png",
               "type":"image/png",
               "sizes":"512x512"
            }
         ]
      },
      "pkg":{
         "private":true,
         "name":"foobar",
         "version":"0.0.0",
         "license":"MIT",
         "scripts":{
            "build":"preact build",
            "serve":"sirv build --port 3001 --cors --single",
            "dev":"preact watch -p 3001",
            "lint":"eslint src",
            "test":"jest"
         },
         "eslintConfig":{
            "extends":"preact",
            "ignorePatterns":[
               "build/"
            ]
         },
         "devDependencies":{
            "enzyme":"^3.10.0",
            "enzyme-adapter-preact-pure":"^2.0.0",
            "eslint":"^6.0.1",
            "eslint-config-preact":"^1.1.0",
            "jest":"^24.9.0",
            "jest-preset-preact":"^1.0.0",
            "preact-cli":"^3.0.0",
            "sirv-cli":"1.0.3"
         },
         "dependencies":{
            "preact":"^10.3.2",
            "preact-render-to-string":"^5.1.4",
            "preact-router":"^3.2.1"
         },
         "jest":{
            "preset":"jest-preset-preact",
            "setupFiles":[
               "<rootdir>/tests/__mocks__/browserMocks.js",
               "<rootdir>/tests/__mocks__/setupTests.js"
            ]
         }
      }
   },
   "scriptLoading":"defer",
   "CLI_DATA":{
      "preRenderData":{
         "url":"/"
      }
   }
}

Не очень полезно, но это и не должно быть. Это только параметры, используемые для настройки html-webpack-plugin.

Однако, если использовать prerender-urls.{json,js}то это становится действительно полезным.

      [
  {
    "url": "/",
    "title": "Home Page",
    "myVal": "foo"
  },
  {
    "url": "/profile",
    "title": "Profile Page",
    "myVal": "bar"
  }
]

Теперь в нашем шаблоне мы можем сделать следующее:

      <meta name="some-meta-tag" content="<%= htmlWebpackPlugin.options.myVal %>">

Это значение будет заменено на то, что вы указали в своем prerender-urls.jsonфайл для каждого предварительно обработанного маршрута.