How to introduce non-es6js files into vue

Introducing non-ES6 JS files into Vue can be achieved by creating and setting the src attribute to point to the script tag of the file path, and setting the type attribute to "text/javascript". If your non-ES6 JS file exports a CommonJS module, you need to assign it to the export default object using Object.assign.

Introducing non-ES6 JS files into Vue

In Vue, you can use script tag to import non-ES6 JS files.

Steps:

1. Create a script tag: In the Vue component template, create a script tag.
2. Specify the path to the non-ES6 JS file: In the script tag, use the src attribute to specify the path to the non-ES6 JS file.
3. Set the type attribute: Set the type attribute of the script tag to "text/javascript".

Example:

<code class="html"><template>
  <div></div>
</template>

<script>
  // 引入 non-es6.js 文件
  import nonES6Js from './non-es6.js';
</script></code>

Note:

• Make sure that non-ES6 JS files export a name An object or function that is default.
• If a non-ES6 JS file contains a CommonJS module, it needs to be assigned to the export default object using Object.assign.

Example (CommonJS):

<code class="javascript">// non-es6.js
module.exports = {
  foo: 'bar'
};</code>

<code class="html"><template>
  <div></div>
</template>

<script>
  // 引入 non-es6.js 文件
  import nonES6Js from './non-es6.js';

  // 分配 CommonJS 模块
  export default Object.assign({}, nonES6Js);
</script></code>

The above is the detailed content of How to introduce non-es6js files into vue. For more information, please follow other related articles on the PHP Chinese website!