{"id":15057,"library":"weex-vue-framework","title":"Weex Vue Framework","description":"weex-vue-framework is a package that provides the Vue 2.0 framework for use with Weex, a platform enabling developers to build Android, iOS, and Web apps from a single codebase using modern web development skills. This package is an \"auto-generated\" component of the Vue.js ecosystem, specifically tailored for the Weex environment. The current stable version of the underlying Vue 2 series is 2.7.16, known as \"Swan Song\", which marked the final official release for Vue 2. It reached its End of Life (EOL) on December 31st, 2023, meaning it no longer receives new features, updates, or official security fixes. As such, this package, being intrinsically tied to Vue 2, is effectively deprecated. Its primary differentiator is its role in enabling Vue 2 applications to render natively on Weex-powered mobile environments, extending Vue's capabilities beyond the browser to native UI rendering.","status":"deprecated","version":"2.5.15-weex.2","language":"javascript","source_language":"en","source_url":"https://github.com/vuejs/vue","tags":["javascript","vue","compiler"],"install":[{"cmd":"npm install weex-vue-framework","lang":"bash","label":"npm"},{"cmd":"yarn add weex-vue-framework","lang":"bash","label":"yarn"},{"cmd":"pnpm add weex-vue-framework","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"While users typically import `Vue` from the generic 'vue' package, in a configured Weex environment, this specific framework is designed to provide the Vue 2 runtime. This import represents accessing the Weex-adapted Vue constructor. For legacy CJS environments in Weex, `require('weex-vue-framework')` might directly yield the Vue instance.","wrong":"const Vue = require('weex-vue-framework')","symbol":"Vue","correct":"import Vue from 'weex-vue-framework'"},{"note":"Hypothetically, this framework might expose an `init` function to explicitly configure or bootstrap the Vue environment within Weex, similar to how other rendering layers are initialized. This pattern is common in framework extensions that need a setup step. Weex itself might internally call such an `init`.","wrong":"import init from 'weex-vue-framework/init'","symbol":"init","correct":"import { init } from 'weex-vue-framework'"},{"note":"Weex documentation often refers to `weex.registerComponent` for extending built-in components. If `weex-vue-framework` is a module, it might export such a utility directly for registering Weex-specific components or enhancing the Vue component registration for native rendering.","wrong":"import { component } from 'weex-vue-framework'","symbol":"registerComponent","correct":"import { registerComponent } from 'weex-vue-framework'"}],"quickstart":{"code":"/* file: src/App.vue */\n<template>\n  <div class=\"wrapper\">\n    <text class=\"message\">Hello Weex with Vue 2!</text>\n    <text class=\"counter\">Count: {{ count }}</text>\n    <button @click=\"increment\" class=\"button\">\n      <text class=\"button-text\">Increment</text>\n    </button>\n  </div>\n</template>\n\n<script>\nexport default {\n  data () {\n    return {\n      count: 0\n    }\n  },\n  methods: {\n    increment () {\n      this.count++\n      console.log('Count incremented to:', this.count)\n    }\n  }\n}\n</script>\n\n<style scoped>\n  .wrapper {\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n    height: 800px; /* Weex requires explicit dimensions */\n    background-color: #f0f0f0;\n  }\n  .message {\n    font-size: 48px;\n    text-align: center;\n    margin-bottom: 30px;\n    color: #333;\n  }\n  .counter {\n    font-size: 36px;\n    color: #666;\n    margin-bottom: 40px;\n  }\n  .button {\n    background-color: #42b983;\n    padding: 20px 40px;\n    border-radius: 10px;\n  }\n  .button-text {\n    color: #ffffff;\n    font-size: 32px;\n  }\n</style>\n\n/* file: src/main.js - entry file for Weex build */\n// The 'use weex:vue' directive is crucial for Weex to identify the framework.\n// { \"framework\": \"Vue\" } // Alternative for Weex v0.16 and earlier\n\nimport Vue from 'vue'; // In a Weex project, this resolves to the Weex-adapted Vue runtime\nimport App from './App.vue';\n\n// Weex requires the root element to be specified for the Vue instance.\n// The #root element is typically provided by the Weex rendering environment.\nnew Vue({\n  el: '#root',\n  render: h => h(App)\n});\n\n// This example assumes a build process using weex-loader or similar,\n// which bundles the .vue file into a JavaScript bundle for native Weex rendering.\n// You would typically run 'weex create myapp' and then build/run the project.\n// e.g., 'npm run build' and 'weex run android' or 'weex run ios'.","lang":"javascript","description":"This quickstart demonstrates a basic Vue 2 Single File Component (SFC) designed for a Weex environment. It shows a simple counter with reactive data and a method to update it, along with Weex-specific styling considerations like explicit dimensions. The `main.js` illustrates the entry point, including the Weex framework annotation and the instantiation of the Vue root component. This setup assumes `weex-vue-framework` is providing the underlying Vue 2 runtime when `import Vue from 'vue'` is called within a Weex project context."},"warnings":[{"fix":"Migrate your application to Vue 3 or consider purchasing Never-Ending Support (NES) for Vue 2 from HeroDevs to receive ongoing security patches and compatibility fixes.","message":"Vue 2, which this framework supports, reached its End of Life (EOL) on December 31st, 2023. This means it no longer receives official updates, bug fixes, or security patches, which can lead to critical security vulnerabilities and compatibility issues with newer platforms or browsers.","severity":"breaking","affected_versions":">=2.7.16"},{"fix":"Consult the official Weex documentation and Vue 2 Weex integration guides for best practices on project setup and dependency management. Avoid trying to update or manage this package as a standalone Vue library unless explicitly directed by Weex documentation.","message":"This package is listed as \"auto-generated\" and is deeply integrated into the Weex platform's rendering pipeline. Direct usage, updates, or troubleshooting might require specific knowledge of the Weex build system and its internal handling of Vue.","severity":"gotcha","affected_versions":">=2.5.15-weex.2"},{"fix":"For new Weex projects, explore if Weex officially supports Vue 3 or alternative modern frameworks. For existing projects, plan for a migration or assess the risks of continuing with an unmaintained framework.","message":"New feature development and official maintenance for this Vue 2 framework are effectively halted due to Vue 2's EOL. Relying on it for new projects or expecting new capabilities is not advisable.","severity":"deprecated","affected_versions":">=2.7.16"},{"fix":"Always use single-file components (`.vue` files) and ensure your Weex build setup includes a template compiler (like `weex-loader`) that transforms templates into render functions before deployment. Define components using `render` functions directly if not using SFCs.","message":"Weex often utilizes a 'runtime-only' build of Vue 2 for performance, which means component templates must be pre-compiled during the build process (e.g., using `weex-loader`). Attempting to use the `template` option or `Vue.compile` at runtime will fail.","severity":"gotcha","affected_versions":">=2.5.15-weex.2"}],"env_vars":null,"last_verified":"2026-04-19T00:00:00.000Z","next_check":"2026-07-18T00:00:00.000Z","problems":[{"fix":"Ensure your entry file includes the `// { \"framework\": \"Vue\" }` comment or `\"use weex:vue\";` directive prologue at the very top, depending on your Weex SDK version. Verify that Weex-related build tools (e.g., `weex-toolkit`, `weex-loader`) are correctly installed and configured.","cause":"The Weex environment or its build process failed to correctly provide or register the Vue 2 framework.","error":"Vue is not defined"},{"fix":"Ensure all Vue components are defined as Single File Components (`.vue` files) and that your build process (e.g., Webpack with `weex-loader`) is correctly configured to pre-compile these templates into `render` functions. Do not use inline templates or `Vue.compile` in your runtime code.","cause":"Attempting to use the `template` option in a Vue component within a Weex environment that is using a runtime-only build of Vue 2.","error":"Failed to compile template: ... Templates should be pre-compiled into render functions."},{"fix":"Verify that the native module 'xxx' is properly implemented and registered within your Android and iOS Weex projects. Check for case sensitivity or naming mismatches. Ensure your Weex SDK version supports the module or that any custom native modules are linked correctly.","cause":"Attempting to use a Weex native module (`weex.requireModule('xxx')`) that is not correctly implemented or registered in the native environment (iOS/Android).","error":"Error: Weex module 'xxx' not found."},{"fix":"This is a warning, not an error preventing compilation. The official fix is to migrate your project to Vue 3. If migration is not immediately feasible, you can explore Vue 2 Never-Ending Support (NES) from HeroDevs for continued security updates, or suppress the warning at your own risk.","cause":"This warning is issued by package managers (like npm) when they detect that your project depends on Vue 2, which has officially reached its End of Life.","error":"EOL/Obsolete Software: Vue 2 Detected."}],"ecosystem":"npm"}