标签：npm vue App Vite js 模板 vue2 vite

 

1.在桌面运行cmd，使用官方命令创建vite

 npm init vite@latest

2.回车

2.回车

直接cd vite-v2 进入vite-v2文件夹后输入 npm install 安装依赖

默认文件夹是这样的

在cmd继续安装vue2依赖命令

npm install vue@2.x vue-template-compiler@2.x -S

再安装对vite对vue2 支持命令

npm install vite-plugin-vue2 --dev

剩下就是创建文件，在根目录创建vite.config.js 文件

打开vite.config.js文件写入代码

import { createVuePlugin } from 'vite-plugin-vue2'

export default {
  plugins: [createVuePlugin()]
}

再根目录创建src文件目录把main.js拖进去

修改index.html文件

 <script type="module" src="/main.js"></script> 
改为
 <script type="module" src="/src/main.js"></script> 

在src文件目录里面新建App.vue 内容写入

<template>
  <div>Hello Vite Vue2</div>
</template>

修改 src/main.js，把默认的代码都删掉，写入新的代码

import Vue from 'vue'
import App from './App.vue'

new Vue({
  render: h => h(App)
}).$mount('#app')

最后运行cmd 输入启动命令

npm run dev

打包命令

npm run build

 

标签：npm,vue,App,Vite,js,模板,vue2,vite
来源： https://www.cnblogs.com/zxh-bug/p/16647851.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。