fix:[Bug]: Tiny Engine CLI形式process is not undefined #1521 #1589
Conversation
WalkthroughA script tag was inserted into packages/canvas/init-canvas/canvas.html to define window.process with an empty env object. It was placed after the meta viewport tag and before the IMPORT_MAP/IMPORT_STYLE blocks. No exported or public entities were changed. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Poem
Tip 🔌 Remote MCP (Model Context Protocol) integration is now available!Pro plan users can now connect to remote MCP servers from the Integrations page. Connect with popular remote MCPs such as Notion and Linear to add more context to your reviews and chats. ✨ Finishing Touches🧪 Generate unit tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. CodeRabbit Commands (Invoked using PR/Issue comments)Type Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (2)
packages/canvas/init-canvas/canvas.html (2)
7-11: Consider defaulting NODE_ENV or documenting why it’s omitted.If any code relies on
process.env.NODE_ENVat runtime (without build-time replacement), set a safe default like'production'. Otherwise, add a brief comment noting that it’s intentionally not set.Option A — set a default:
- var env = (existing.env && typeof existing.env === 'object') ? existing.env : {}; + var env = (existing.env && typeof existing.env === 'object') ? existing.env : {}; + if (env.NODE_ENV == null) env.NODE_ENV = 'production';Option B — document the choice:
- // Minimal, non-invasive polyfill so browser code expecting process.env doesn't crash. + // Minimal, non-invasive polyfill so browser code expecting process.env doesn't crash. + // Intentionally not setting env.NODE_ENV here; bundlers should replace it at build-time.
7-11: Ensure inline script compatibility under strict CSPWe’ve confirmed that:
- The
canvas.htmlinline snippet (lines 7–11) remains:<script> window.process = { env: {} }; </script>- There are no CSP definitions in your HTML files or server-side code that would currently block inline scripts. The only CSP-related code is the
upgradeHttpsPlugin, which injects aContent-Security-Policy: upgrade-insecure-requestsmeta tag intoindex.html,preview.html, andpreviewApp.htmlwhen inalphaorprodmode—this does not affectcanvas.html.- No references to
unsafe-inline, no<meta http-equiv="Content-Security-Policy">tags outside the plugin, and nosetHeader('Content-Security-Policy', …)or Helmet middleware usage were found in the repo.However, if your deployment environment enforces a stricter CSP (e.g. disallowing inline scripts), this snippet will be blocked. To future-proof against that:
• Move this code into a tiny external JS file (e.g.
init-canvas.js), and include it via<script src="init-canvas.js" integrity="<hash>" nonce="<nonce>"></script>or bind it with the nonce/hash you provision in your CSP.
• Alternatively, compute and inject ansha256-…hash of the inline block into your CSP policy.Please also verify with your infrastructure/configuration team whether any CSP headers are applied at the server or CDN layer that could affect inline scripts.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (1)
packages/canvas/init-canvas/canvas.html(1 hunks)
🧰 Additional context used
🧠 Learnings (1)
📓 Common learnings
Learnt from: gene9831
PR: opentiny/tiny-engine#1041
File: packages/plugins/datasource/src/DataSourceList.vue:138-138
Timestamp: 2025-01-14T10:06:25.508Z
Learning: PR #1041 in opentiny/tiny-engine is specifically for reverting Prettier v3 formatting to v2, without any logical code changes or syntax improvements.
🔇 Additional comments (1)
packages/canvas/init-canvas/canvas.html (1)
7-11: Approve process injection as safe in canvas.htmlAll occurrences of
process.cwd()and similar Node-only properties are confined to build and test scripts, which run in Node (wherewindow.processisn’t present), so they won’t be affected by the injectedwindow.process. No browser-side modules performtypeof processchecks or access Node-only fields.• packages/vue-generator/test/testcases/full/index.js: uses
process.cwd()in test runner
• packages/build/vite-config/src/vite-plugins/treeShakingPlugin.js: usesprocess.cwd()for path resolution
• packages/build/vite-config/src/vite-plugins/devAliasPlugin.js: usesprocess.cwd()for base paths
• packages/build/vite-config/src/vite-plugins/cdnCopyPlugin.js: usesprocess.cwd()for file copying
• packages/build/vite-config/src/default-config.js: usesprocess.cwd()for HTML entry points
• packages/build/vite-config/src/localCdnFile/importMapLocalPlugin.js: usesprocess.cwd()for import-map lookupNo front-end code depends on Node-only
processfields—this quick fix can be merged.
| <script> | ||
| window.process = { | ||
| env : {} | ||
| }; | ||
| </script> |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Avoid clobbering globals; make the polyfill minimal and browser-explicit.
Unconditionally overwriting window.process risks breaking libraries that use typeof process !== 'undefined' as a Node-runtime signal. Guard the assignment, preserve any existing env, and set process.browser = true to reduce false “Node” detections in the browser.
Apply this diff to make the polyfill non-invasive:
- <script>
- window.process = {
- env : {}
- };
- </script>
+ <script>
+ // Minimal, non-invasive polyfill so browser code expecting process.env doesn't crash.
+ (function () {
+ var w = window;
+ var existing = (w.process && typeof w.process === 'object') ? w.process : {};
+ var env = (existing.env && typeof existing.env === 'object') ? existing.env : {};
+ // Do not overwrite existing keys; just ensure objects exist.
+ existing.env = env;
+ // Explicitly mark as browser to avoid libraries mistaking this for Node.
+ existing.browser = true;
+ w.process = existing;
+ })();
+ </script>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <script> | |
| window.process = { | |
| env : {} | |
| }; | |
| </script> | |
| <script> | |
| // Minimal, non-invasive polyfill so browser code expecting process.env doesn't crash. | |
| (function () { | |
| var w = window; | |
| var existing = (w.process && typeof w.process === 'object') ? w.process : {}; | |
| var env = (existing.env && typeof existing.env === 'object') ? existing.env : {}; | |
| // Do not overwrite existing keys; just ensure objects exist. | |
| existing.env = env; | |
| // Explicitly mark as browser to avoid libraries mistaking this for Node. | |
| existing.browser = true; | |
| w.process = existing; | |
| })(); | |
| </script> |
🤖 Prompt for AI Agents
In packages/canvas/init-canvas/canvas.html around lines 7 to 11, the inline
script unconditionally overwrites window.process which can break libs checking
for Node; instead only create window.process if it doesn't exist, ensure
process.env is preserved or initialized to an empty object if missing, and add
process.browser = true so libraries detect a browser environment; do not remove
existing properties — merge/assign env rather than clobbering the whole object.
|
在这里加： defineConfig({
define: {
process: {
env: {}
}
},
}) |
Add here: defineConfig({
define: {
process: {
env: {}
}
},
}) |
4 participants
English | 简体中文
PR
PR Checklist
Please check if your PR fulfills the following requirements:
PR Type
What kind of change does this PR introduce?
Background and solution
What is the current behavior?
Issue Number: N/A
What is the new behavior?
Does this PR introduce a breaking change?
Other information
修复 #1521 问题，请采纳，避免每次安装新版本需要执行patch 兼容错误。
Summary by CodeRabbit