• Uni-app工程转vue-cli工程步骤


    Uni-app工程转vue-cli工程步骤

    一、全局安装vue-cli

    // 安装之前需要安装node,npm,安装方法自行百度
    
    npm install -g @vue/cli
    

    二、创建一个空的uni-app工程

    //使用正式版(对应HBuilderX最新正式版),my-project项目名称不支持驼峰式命名
    
    vue create -p dcloudio/uni-preset-vue my-project
    
    //执行命令会先安装uni-app的插件,插件安装完成后,会提示选择项目模板,可选择默认模版
    

    安装完成后的目录结构:

    三、安装sass

    npm install node-sass@4.14.1 --save
    npm install sass-loader@8.0.0 --save
    
    // 注:node-sass和sass-loader安装需要制定版本,版本太高会不兼容,指定版本如安装不成功自行百度解决办法
    

    安装成功后在package.json文件中查看

    四、替换src目录文件

    1. 将新建的项目中的src文件里边的内容全部删掉;

    2. 将之前hbuilder创建的项目中的文件拷贝到新建项目的src目录

    五、修改部分文件

    由于之前在项目中引用了sacc和less两种css预处理器,在vue-cli中两种会冲突,所以需要把之前用到的less处理器的文件给修改为sass处理器。(以后开发uni-app项目只用sass即可,uni-app的插件市场的插件基本也都是使用的sass)

    1. 将common目录下的page.less文件修改为page.scss

    2. 将app.vue文件引用的page.less改为page.scss

    3. 检查其他vue文件的样式声明(主要是pages目录下的页面)

    如lang="less"都需要改为lang="sass"

    六、运行项目

    npm run serve
    

    七、项目打包

    npm run build
    

    八、总结

    ​ 由于安全管控app的子app较多,不需要一个一个创建,可创建一个标准的空项目,以该项目的package.json文件的依赖包为准,其他项目直接拷贝安装就行(保证各app的依赖包版本统一)。

    1. 创建项目文件夹,拷贝标准项目模版,只拷贝红框内的文件。
    2. 替换src文件内容。
    3. 执行npm install安装依赖包。
    4. 执行npm run serve运行项目。
    5. 执行npm run build打包项目。
  • 相关阅读:
    INT 21H 指令说明及使用方法 (转载)
    数织等逻辑游戏网站推荐
    常见文件格式(转载)
    我有一个通信梦 我收集的通信基础的资源
    MATLAB信号处理常用函数(转载)
    来自我的Moments-实用学习资源或网站
    三角形中的等量关系 一些等式
    【公式编辑测试】三角形中线垂线角平分线长度公式
    【备忘录】麦克斯韦速率分布
    【备忘录】转动惯量张量(转载和再补充一些东西)
  • 原文地址:https://www.cnblogs.com/zhanglongke/p/14097886.html
Copyright © 2020-2023  润新知