[JavaScript知识库]vue打包为App手摸手教你

Good things come to those who wait.
耐心等待，终有回报。

一、修改请求静态资源的路径
打开config下的index.js文件，修改assetsPublicPath的值，从‘/’改为‘./’。即从根路径改为相对路径。

build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: './',
 }

二、修改本地图片的路径
打开build下的utils.js文件，增加?publicPath:'../../'

if (options.extract) {
  return ExtractTextPlugin.extract({
    use: loaders,
    fallback: 'vue-style-loader',
    publicPath:'../../'
  })
} else {
  return ['vue-style-loader'].concat(loaders)
}

三、在终端运行npm run build。

四?、 运行成功后，可以看到，在根目录下多了一个dist文件。?

?五?、在HBuilderX建一个空项目,将dist文件夹里面的东西复制进去,点击hbuilderx发行原生

等待打包完成

完毕

Good things come to those who wait.
耐心等待，终有回报。