根据大神写的来的 自己走了一遍vue2.0 写的 Vue.js 中文社区APP,别打我哈。亲,给个Star呗。
发布于 7 年前 作者 liangjilin 4220 次浏览 最后一次编辑是 7 年前 来自 分享
粉丝福利 : 关注VUE中文社区公众号,回复视频领取粉丝福利

安照众位大神写的vue2.0 写的 Vue.js 中文社区APP然后自己利用工作之余重新撸了一遍。 从run dev, 到 run build 到 cordova build android成功将应用弄到手机上安装使用了。 而且不同在于我用了fetch,vuex等等,我觉得小细节方面对大家还是挺有用的,大牛神除外哈。希望大家都要亲身去跟着人家写的代码写一遍,不懂的翻翻文档。还是很有用的。

执行项目

安装依赖 npm install 启动服务 npm run dev 运行 localhost:8070/#/

打包

需要先修改build文件夹里的webpack.base.conf.js的publicPath: ‘./’ npm run build 打包成功后还有改一下index.html引入的flexible和flexible_css这两个js路径,改为去掉.static即可

打包成APK

先全局安装下cordova—> npm install -g cordova (在此之前,一定要把环境搭好,也就是sdk,jdk那些环境变量) 然后

     cordova create myApp org.apache.cordova.myApp myApp        //  创建项目
     cd myApp     进入根目录路径
     cordova platform add android        添加android

项目的index.html引入cordova.js <script type="text/javascript" src="cordova.js"></script>

    <body>
        <div id="app"></div>
        <script type="text/javascript" src="cordova.js"></script>
        <!-- built files will be auto injected -->
    </body>

修改main.js

  document.addEventListener('deviceready', function() {
      new Vue({
          el: '#app',
          router,
          store,
          template: '<App/>',
          components: { App }
      })
      window.navigator.splashscreen.hide()
  }, false);

修改build

    assetsSubDirectory: '',
    assetsPublicPath: '',

在vue项目中npm run build,完了之后记得修改一下index.html引入的flexible和flexible_css这两个js路径,改为去掉.static即可 最后在你的cmd 中cordova build android就行了,然后可以拿到手机上安装了

回到顶部