HB打包vue-cli创建的Vue项目为app文件

1.修改vue项目config文件夹下面的index.js中bulid模块导出的路径,因为index.html里边的内容都是通过script标签引入的,原生打包后路径不对

        默认路径:

                build: {

                        // Template for index.html

                         index: path.resolve(__dirname, '../dist/index.html'),

                        assetsRoot: path.resolve(__dirname, '../dist'),

                        assetsSubDirectory: 'static',

                        assetsPublicPath: '/',

                        productionSourceMap: true,

                        devtool: '#source-map',

                        productionGzip: false,

                        productionGzipExtensions: ['js', 'css'],

                        bundleAnalyzerReport: process.env.npm_config_report

                    }

assetsPublicPath默认的是  ‘/’  也就是根目录。而我们的index.html和static在同一级目录下面。所以要改为  ‘./ ’

注:另外还需要注意一点。src里边router/index.js路由配置里边默认模式是hash,如果你改成了history模式的话,打开也会是一片空白。所以改为hash或者直接把模式配置删除,让它默认的就行

2.打包:npm run build;

3.新建App项目:使用HBuilder新建一个app项目,然后把里边的unpackage和manifest这两个保留下来,其他的内容删除;

4.将webpack打包后生成的dist目录中的全部文件copy到步骤3新建app项目中;

5. npm run build  打包卡住不动解决办法

        修改为淘宝镜像:npm config set registry http://registry.cnpmjs.org

你可能感兴趣的:(HB打包vue-cli创建的Vue项目为app文件)